/* ============================================================
   VARNI CONTACT PAGE — ISOLATED ELITE CSS
   ------------------------------------------------------------
   vct-* = Varni Contact Team
   vci-* = Varni Contact Inquiry
============================================================ */


/* ============================================================
   01. GLOBAL CONTACT TEAM SECTION
============================================================ */

.vct-section{
    position:relative;
    padding:105px 0 90px;
    overflow:hidden;

    background:
        linear-gradient(
            180deg,
            #ffffff 0%,
            #f7fbff 55%,
            #ffffff 100%
        );
}


/* SUBTLE DOT BACKGROUND */

.vct-section::before{
    content:"";
    position:absolute;
    inset:0;

    background-image:
        radial-gradient(
            rgba(8,127,209,.065) 1px,
            transparent 1px
        );

    background-size:30px 30px;

    -webkit-mask-image:
        linear-gradient(
            to bottom,
            transparent 0%,
            #000 20%,
            #000 80%,
            transparent 100%
        );

    mask-image:
        linear-gradient(
            to bottom,
            transparent 0%,
            #000 20%,
            #000 80%,
            transparent 100%
        );

    pointer-events:none;
}


/* BACKGROUND GLOWS */

.vct-bg-glow{
    position:absolute;
    border-radius:50%;
    pointer-events:none;
}


.vct-bg-glow-left{
    width:550px;
    height:550px;

    top:100px;
    left:-390px;

    background:
        radial-gradient(
            circle,
            rgba(9,157,230,.13),
            transparent 70%
        );
}


.vct-bg-glow-right{
    width:550px;
    height:550px;

    right:-390px;
    bottom:-120px;

    background:
        radial-gradient(
            circle,
            rgba(8,102,210,.10),
            transparent 70%
        );
}


/* ============================================================
   TEAM SECTION HEADER
============================================================ */

.vct-header{
    position:relative;
    z-index:2;

    max-width:820px;
    margin:0 auto 55px;

    text-align:center;
}


.vct-eyebrow{
    display:flex;
    align-items:center;
    justify-content:center;

    gap:13px;

    margin-bottom:17px;
}


.vct-eyebrow > span{
    width:34px;
    height:1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            #159fe8
        );
}


.vct-eyebrow > span:last-child{
    background:
        linear-gradient(
            90deg,
            #159fe8,
            transparent
        );
}


.vct-eyebrow div{
    display:flex;
    align-items:center;

    gap:7px;

    color:#0788dd;

    font-size:11px;
    font-weight:800;

    letter-spacing:1.8px;
}


.vct-eyebrow i{
    font-size:15px;
}


.vct-header h2{
    margin:0 0 17px;

    color:#09203f;

    font-size:50px;
    font-weight:800;

    line-height:1.1;
    letter-spacing:-1.7px;
}


.vct-header h2 span{
    color:#0798e5;
}


.vct-header p{
    max-width:680px;
    margin:0 auto;

    color:#6e7e92;

    font-size:16px;
    line-height:1.75;
}


/* ============================================================
   TEAM GRID
============================================================ */

.vct-grid{
    position:relative;
    z-index:2;

    display:grid;
    grid-template-columns:repeat(4, minmax(0, 1fr));

    gap:20px;
}


/* ============================================================
   PERSON CARD
============================================================ */

.vct-card{
    position:relative;

    min-width:0;
    min-height:450px;

    padding:22px;

    display:flex;
    flex-direction:column;

    border:1px solid #e2eaf3;
    border-radius:24px;

    background:
        linear-gradient(
            145deg,
            rgba(255,255,255,.98),
            rgba(248,251,255,.98)
        );

    box-shadow:
        0 12px 38px rgba(18,55,95,.06);

    overflow:hidden;

    transition:
        transform .4s ease,
        box-shadow .4s ease,
        border-color .4s ease;
}


.vct-card:hover{
    transform:translateY(-9px);

    border-color:rgba(7,152,229,.28);

    box-shadow:
        0 28px 65px rgba(15,65,110,.13);
}


/* TOP ACCENT */

.vct-card-accent{
    position:absolute;

    top:0;
    left:50%;

    width:0;
    height:3px;

    transform:translateX(-50%);

    border-radius:0 0 5px 5px;

    background:
        linear-gradient(
            90deg,
            #0877d7,
            #16b8ec
        );

    transition:width .45s ease;
}


.vct-card:hover .vct-card-accent{
    width:58%;
}


/* ============================================================
   CARD TOP AREA
============================================================ */

.vct-card-top{
    display:flex;
    align-items:center;
    justify-content:space-between;

    gap:12px;

    margin-bottom:23px;
}


/* AVATAR */

.vct-avatar{
    width:62px;
    height:62px;

    flex-shrink:0;

    display:flex;
    align-items:center;
    justify-content:center;

    border:1px solid #d9edf9;
    border-radius:18px;

    color:#087fd1;

    background:
        linear-gradient(
            145deg,
            #eaf7fe,
            #f4fbff
        );

    font-size:15px;
    font-weight:800;

    letter-spacing:.7px;

    box-shadow:
        0 8px 22px rgba(8,127,209,.08);

    transition:
        color .35s ease,
        background .35s ease,
        transform .35s ease,
        box-shadow .35s ease;
}


.vct-card:hover .vct-avatar{
    color:#ffffff;

    background:
        linear-gradient(
            135deg,
            #0875d5,
            #16b7eb
        );

    transform:rotate(-3deg) scale(1.04);

    box-shadow:
        0 13px 28px rgba(8,117,213,.24);
}


/* DIRECTOR AVATAR */

.vct-director-avatar{
    color:#ffffff;

    border:none;

    background:
        linear-gradient(
            135deg,
            #071b36,
            #0d5794
        );
}


/* REGION BADGE */

.vct-region-badge{
    max-width:150px;

    display:inline-flex;
    align-items:center;

    gap:6px;

    padding:7px 10px;

    border:1px solid #dcecf7;
    border-radius:20px;

    color:#4e6c84;
    background:#f5faff;

    font-size:9px;
    font-weight:750;

    line-height:1.2;
    text-align:center;
}


.vct-region-badge i{
    flex-shrink:0;

    color:#0788dd;
    font-size:11px;
}


.vct-director-badge{
    color:#40546c;

    background:#f2f6fa;

    border-color:#dfe7ef;
}


/* ============================================================
   PERSON CONTENT
============================================================ */

.vct-person-content{
    margin-bottom:20px;
}


.vct-role{
    display:block;

    margin-bottom:7px;

    color:#0788dd;

    font-size:10px;
    font-weight:800;

    letter-spacing:1.4px;
}


.vct-person-content h3{
    margin:0 0 10px;

    color:#102540;

    font-size:20px;
    font-weight:800;

    line-height:1.3;
    letter-spacing:-.3px;
}


.vct-person-content p{
    margin:0;

    color:#718095;

    font-size:13px;
    line-height:1.65;
}


/* ============================================================
   CONTACT DETAILS
============================================================ */

.vct-contact-details{
    display:flex;
    flex-direction:column;

    gap:9px;

    margin-bottom:20px;
}


.vct-detail-link{
    min-width:0;

    display:flex;
    align-items:center;

    gap:10px;

    padding:10px;

    border:1px solid #e8eef5;
    border-radius:12px;

    color:inherit;
    background:#ffffff;

    text-decoration:none;

    transition:
        border-color .25s ease,
        background .25s ease,
        transform .25s ease;
}


.vct-detail-link:hover{
    color:inherit;

    border-color:#d1e8f7;
    background:#f8fcff;

    transform:translateX(3px);
}


.vct-detail-icon{
    width:34px;
    height:34px;

    flex-shrink:0;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:9px;

    color:#0788dd;
    background:#eaf6fd;

    font-size:12px;
}


.vct-detail-link > span:last-child{
    min-width:0;
}


.vct-detail-link small{
    display:block;

    margin-bottom:1px;

    color:#8a97a7;

    font-size:8px;
    font-weight:650;

    text-transform:uppercase;
    letter-spacing:.6px;
}


.vct-detail-link strong{
    display:block;

    max-width:100%;

    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;

    color:#40566e;

    font-size:10px;
    font-weight:700;
}


/* ============================================================
   CARD ACTION BUTTONS
============================================================ */

.vct-actions{
    display:grid;
    grid-template-columns:.8fr 1.35fr 42px;

    gap:7px;

    margin-top:auto;
    padding-top:17px;

    border-top:1px solid #e8eef5;
}


.vct-action-btn{
    height:42px;

    display:flex;
    align-items:center;
    justify-content:center;

    gap:6px;

    border-radius:10px;

    text-decoration:none;

    font-size:10px;
    font-weight:750;

    transition:
        transform .25s ease,
        box-shadow .25s ease,
        color .25s ease,
        background .25s ease,
        border-color .25s ease;
}


.vct-action-btn:hover{
    transform:translateY(-3px);
}


/* CALL BUTTON */

.vct-action-call{
    color:#087fd1;

    border:1px solid #d6eaf8;

    background:#edf7fd;
}


.vct-action-call:hover{
    color:#ffffff;

    border-color:#087fd1;
    background:#087fd1;

    box-shadow:
        0 9px 20px rgba(8,127,209,.22);
}


/* WHATSAPP BUTTON */

.vct-action-whatsapp{
    color:#168f4f;

    border:1px solid #cdebd9;

    background:#eefaf3;
}


.vct-action-whatsapp:hover{
    color:#ffffff;

    border-color:#18a85b;
    background:#18a85b;

    box-shadow:
        0 9px 20px rgba(24,168,91,.22);
}


/* EMAIL BUTTON */

.vct-action-mail{
    color:#d95252;

    border:1px solid #f2dcdc;

    background:#fff2f2;

    font-size:14px;
}


.vct-action-mail:hover{
    color:#ffffff;

    border-color:#df5555;
    background:#df5555;

    box-shadow:
        0 9px 20px rgba(223,85,85,.20);
}


/* ============================================================
   DIRECTOR CARD
============================================================ */

.vct-director-card{
    border-color:rgba(8,127,209,.20);

    background:
        linear-gradient(
            145deg,
            #f4faff 0%,
            #ffffff 70%
        );
}


.vct-director-card::before{
    content:"";

    position:absolute;

    width:190px;
    height:190px;

    top:-110px;
    right:-100px;

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(8,127,209,.10),
            transparent 70%
        );

    pointer-events:none;
}


/* ============================================================
   TEAM SUPPORT STRIP
============================================================ */

.vct-support-strip{
    position:relative;
    z-index:2;

    margin-top:32px;
    padding:21px 24px;

    display:flex;
    align-items:center;
    justify-content:space-between;

    gap:25px;

    border:1px solid #dceae5;
    border-radius:18px;

    background:
        linear-gradient(
            135deg,
            #f0faf5,
            #ffffff
        );

    box-shadow:
        0 12px 35px rgba(20,70,50,.045);
}


.vct-support-status{
    display:flex;
    align-items:center;

    gap:13px;
}


.vct-status-dot{
    width:11px;
    height:11px;

    flex-shrink:0;

    border-radius:50%;

    background:#20b26b;

    box-shadow:
        0 0 0 6px rgba(32,178,107,.12);

    animation:vctStatusPulse 2s ease-in-out infinite;
}


@keyframes vctStatusPulse{

    0%,
    100%{
        box-shadow:
            0 0 0 5px rgba(32,178,107,.10);
    }

    50%{
        box-shadow:
            0 0 0 9px rgba(32,178,107,.05);
    }

}


.vct-support-status strong{
    display:block;

    margin-bottom:2px;

    color:#173e2c;

    font-size:14px;
    font-weight:800;
}


.vct-support-status small{
    display:block;

    color:#6e8277;

    font-size:11px;
}


/* REGION LIST */

.vct-region-list{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    flex-wrap:wrap;

    gap:7px;
}


.vct-region-list span{
    display:inline-flex;
    align-items:center;

    gap:5px;

    padding:7px 10px;

    border:1px solid #dce7ef;
    border-radius:20px;

    color:#577085;
    background:#ffffff;

    font-size:9px;
    font-weight:700;
}


.vct-region-list i{
    color:#20a867;
    font-size:9px;
}


/* ============================================================
   02. BUSINESS INQUIRY SECTION
============================================================ */

.vci-section{
    position:relative;

    padding:105px 0;

    overflow:hidden;

    background:
        linear-gradient(
            180deg,
            #f4f9fd 0%,
            #eef6fc 50%,
            #f7fbfe 100%
        );
}


/* TOP SEPARATOR */

.vci-section::before{
    content:"";

    position:absolute;

    top:0;
    left:50%;

    width:80%;
    height:1px;

    transform:translateX(-50%);

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(8,127,209,.18),
            transparent
        );
}


/* BACKGROUND GLOW */

.vci-bg-glow{
    position:absolute;

    width:650px;
    height:650px;

    top:-390px;
    left:50%;

    transform:translateX(-50%);

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(9,157,230,.10),
            transparent 70%
        );

    pointer-events:none;
}


/* ============================================================
   INQUIRY PANEL
============================================================ */

.vci-panel{
    position:relative;

    border:1px solid #dfe8f1;
    border-radius:28px;

    background:#ffffff;

    box-shadow:
        0 30px 85px rgba(15,55,95,.11);

    overflow:hidden;
}


/* ============================================================
   INQUIRY HEADER
============================================================ */

.vci-header{
    position:relative;

    padding:36px 38px 31px;

    border-bottom:1px solid #e7edf4;

    background:
        linear-gradient(
            145deg,
            #ffffff,
            #f8fcff
        );
}


.vci-header::after{
    content:"";

    position:absolute;

    width:260px;
    height:260px;

    right:-130px;
    top:-170px;

    border-radius:50%;

    background:
        radial-gradient(
            circle,
            rgba(8,151,229,.11),
            transparent 70%
        );

    pointer-events:none;
}


.vci-header-content{
    position:relative;
    z-index:2;

    display:flex;
    align-items:flex-start;
    justify-content:space-between;

    gap:30px;
}


.vci-eyebrow{
    display:inline-flex;
    align-items:center;

    gap:7px;

    margin-bottom:12px;

    color:#0788dd;

    font-size:10px;
    font-weight:800;

    letter-spacing:1.6px;
}


.vci-eyebrow i{
    font-size:13px;
}


.vci-header h2{
    margin:0 0 12px;

    color:#09203f;

    font-size:39px;
    font-weight:800;

    line-height:1.12;
    letter-spacing:-1.3px;
}


.vci-header h2 span{
    color:#0798e5;
}


.vci-header p{
    max-width:620px;

    margin:0;

    color:#718095;

    font-size:14px;
    line-height:1.7;
}


/* ============================================================
   RESPONSE BADGE
============================================================ */

.vci-response-badge{
    min-width:155px;

    padding:13px;

    display:flex;
    align-items:center;

    gap:10px;

    border:1px solid #d8eaf6;
    border-radius:15px;

    background:rgba(245,251,255,.95);
}


.vci-response-icon{
    width:40px;
    height:40px;

    flex-shrink:0;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:11px;

    color:#ffffff;

    background:
        linear-gradient(
            135deg,
            #0874d4,
            #17b8ec
        );

    box-shadow:
        0 8px 20px rgba(8,116,212,.18);

    font-size:15px;
}


.vci-response-badge strong{
    display:block;

    color:#102540;

    font-size:12px;
    font-weight:800;
}


.vci-response-badge span{
    display:block;

    margin-top:1px;

    color:#7a899b;

    font-size:9px;
}


/* ============================================================
   FORM CONTAINER
============================================================ */

.vci-form{
    padding:34px 38px 0;
}


/* ============================================================
   STEP HEADING
============================================================ */

.vci-step-heading{
    display:flex;
    align-items:center;

    gap:11px;

    margin-bottom:18px;
}


.vci-step-spacing{
    margin-top:31px;
}


.vci-step-number{
    width:34px;
    height:34px;

    flex-shrink:0;

    display:flex;
    align-items:center;
    justify-content:center;

    border:1px solid #d9ebf7;
    border-radius:10px;

    color:#087fd1;

    background:#edf7fd;

    font-size:10px;
    font-weight:800;
}


.vci-step-heading strong{
    display:block;

    color:#1b304a;

    font-size:13px;
    font-weight:800;
}


.vci-step-heading small{
    display:block;

    margin-top:1px;

    color:#8a96a6;

    font-size:10px;
}


/* ============================================================
   FORM FIELD
============================================================ */

.vci-field{
    width:100%;
}


.vci-field label{
    display:block;

    margin:0 0 7px 2px;

    color:#40546a;

    font-size:11px;
    font-weight:700;
}


.vci-field label em{
    color:#e14e4e;

    font-style:normal;
}


.vci-control{
    position:relative;
}


/* LEFT ICON */

.vci-control > i:first-child{
    position:absolute;

    z-index:3;

    top:50%;
    left:15px;

    transform:translateY(-50%);

    color:#8393a6;

    font-size:15px;

    pointer-events:none;

    transition:color .25s ease;
}


.vci-control:focus-within > i:first-child{
    color:#0788dd;
}


/* INPUT / SELECT / TEXTAREA */

.vci-control input,
.vci-control select,
.vci-control textarea{
    width:100%;

    border:1px solid #dfe7f0;
    outline:none;

    border-radius:12px;

    color:#20364e;
    background:#f9fbfd;

    font-family:inherit;
    font-size:13px;

    transition:
        border-color .25s ease,
        background .25s ease,
        box-shadow .25s ease;
}


.vci-control input,
.vci-control select{
    height:51px;

    padding:
        0 42px
        0 43px;
}


.vci-control input::placeholder,
.vci-control textarea::placeholder{
    color:#a0acba;
}


.vci-control select{
    appearance:none;
    -webkit-appearance:none;

    cursor:pointer;
}


.vci-control input:focus,
.vci-control select:focus,
.vci-control textarea:focus{
    border-color:#159fe8;

    background:#ffffff;

    box-shadow:
        0 0 0 4px rgba(21,159,232,.08);
}


/* SELECT ARROW */

.vci-control .vci-select-arrow{
    position:absolute;

    top:50%;
    right:15px;
    left:auto;

    transform:translateY(-50%);

    color:#8494a6;

    font-size:10px;

    pointer-events:none;
}


/* ============================================================
   TEXTAREA
============================================================ */

.vci-textarea-control > i:first-child{
    top:17px;

    transform:none;
}


.vci-control textarea{
    min-height:145px;

    padding:
        15px 16px
        15px 43px;

    line-height:1.65;

    resize:vertical;
}


/* ============================================================
   ACTION AREA
============================================================ */

.vci-action-area{
    margin-top:28px;
    padding:25px 0 30px;

    display:flex;
    align-items:center;
    justify-content:space-between;

    gap:25px;

    border-top:1px solid #e8eef4;
}


.vci-action-buttons{
    display:flex;
    align-items:center;

    gap:10px;
}


/* SUBMIT BUTTON */

.vci-submit-btn{
    height:50px;

    padding:0 23px;

    display:inline-flex;
    align-items:center;
    justify-content:center;

    gap:18px;

    border:0;
    border-radius:11px;

    color:#ffffff;

    background:
        linear-gradient(
            135deg,
            #086fd0,
            #079fe7
        );

    box-shadow:
        0 12px 28px rgba(8,111,208,.21);

    font-family:inherit;
    font-size:13px;
    font-weight:750;

    cursor:pointer;

    transition:
        transform .3s ease,
        box-shadow .3s ease;
}


.vci-submit-btn:hover{
    transform:translateY(-3px);

    box-shadow:
        0 18px 36px rgba(8,111,208,.29);
}


.vci-submit-btn i{
    font-size:13px;

    transition:transform .3s ease;
}


.vci-submit-btn:hover i{
    transform:translateX(5px);
}


/* WHATSAPP BUTTON */

.vci-whatsapp-btn{
    height:50px;

    padding:0 19px;

    display:inline-flex;
    align-items:center;
    justify-content:center;

    gap:8px;

    border:1px solid #cdebd9;
    border-radius:11px;

    color:#168c4d;
    background:#f0fbf5;

    text-decoration:none;

    font-size:13px;
    font-weight:750;

    transition:
        color .3s ease,
        background .3s ease,
        border-color .3s ease,
        transform .3s ease,
        box-shadow .3s ease;
}


.vci-whatsapp-btn i{
    font-size:17px;
}


.vci-whatsapp-btn:hover{
    color:#ffffff;

    border-color:#18a85b;
    background:#18a85b;

    transform:translateY(-3px);

    box-shadow:
        0 12px 25px rgba(24,168,91,.21);
}


/* PRIVACY NOTE */

.vci-privacy-note{
    max-width:280px;

    display:flex;
    align-items:flex-start;

    gap:8px;

    color:#8391a2;

    font-size:10px;
    line-height:1.5;
}


.vci-privacy-note i{
    flex-shrink:0;

    margin-top:1px;

    color:#20a867;

    font-size:15px;
}


/* ============================================================
   TRUST FOOTER
============================================================ */

.vci-trust-footer{
    padding:21px 34px;

    display:flex;
    align-items:center;
    justify-content:space-around;

    gap:20px;

    border-top:1px solid #e4ecf4;

    background:
        linear-gradient(
            135deg,
            #f3f9fd,
            #f9fcfe
        );
}


.vci-trust-item{
    display:flex;
    align-items:center;

    gap:10px;
}


.vci-trust-icon{
    width:38px;
    height:38px;

    flex-shrink:0;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:10px;

    color:#087fd1;
    background:#e7f4fc;

    font-size:14px;
}


.vci-trust-item strong{
    display:block;

    color:#21384f;

    font-size:11px;
    font-weight:800;
}


.vci-trust-item span{
    display:block;

    margin-top:1px;

    color:#8290a1;

    font-size:9px;
}


.vci-trust-divider{
    width:1px;
    height:35px;

    background:#dce5ee;
}


/* ============================================================
   03. LARGE TABLET / SMALL DESKTOP
============================================================ */

@media(max-width:1199px){

    .vct-grid{
        grid-template-columns:
            repeat(2, minmax(0, 1fr));

        gap:20px;
    }


    .vct-card{
        min-height:420px;
    }


    .vci-header-content{
        align-items:flex-start;
    }


    .vci-header h2{
        font-size:36px;
    }

}


/* ============================================================
   04. TABLET
============================================================ */

@media(max-width:991px){

    .vct-section{
        padding:80px 0 75px;
    }


    .vci-section{
        padding:80px 0;
    }


    .vct-header{
        margin-bottom:42px;
    }


    .vct-header h2{
        font-size:42px;
    }


    .vct-header p{
        font-size:15px;
    }


    .vct-support-strip{
        flex-direction:column;
        align-items:flex-start;
    }


    .vct-region-list{
        justify-content:flex-start;
    }


    .vci-header-content{
        display:block;
    }


    .vci-response-badge{
        display:inline-flex;

        margin-top:20px;
    }


    .vci-action-area{
        align-items:flex-start;
        flex-direction:column;
    }


    .vci-privacy-note{
        max-width:100%;
    }

}


/* ============================================================
   05. MOBILE
============================================================ */

@media(max-width:767px){

    .vct-section{
        padding:65px 0 60px;
    }


    .vci-section{
        padding:65px 0;
    }


    /* TEAM HEADER */

    .vct-header{
        margin-bottom:34px;
    }


    .vct-eyebrow{
        gap:8px;
    }


    .vct-eyebrow > span{
        width:20px;
    }


    .vct-eyebrow div{
        font-size:9px;

        letter-spacing:1.2px;
    }


    .vct-header h2{
        font-size:34px;

        letter-spacing:-.9px;
    }


    .vct-header p{
        font-size:14px;

        line-height:1.65;
    }


    /* TEAM GRID */

    .vct-grid{
        grid-template-columns:1fr;

        gap:15px;
    }


    .vct-card{
        min-height:auto;

        padding:19px;

        border-radius:20px;
    }


    .vct-card-top{
        margin-bottom:18px;
    }


    .vct-avatar{
        width:56px;
        height:56px;

        border-radius:16px;
    }


    .vct-person-content h3{
        font-size:19px;
    }


    .vct-person-content p{
        font-size:13px;
    }


    .vct-detail-link strong{
        font-size:10px;
    }


    .vct-actions{
        grid-template-columns:
            1fr 1.3fr 42px;
    }


    /* SUPPORT STRIP */

    .vct-support-strip{
        margin-top:25px;

        padding:18px;

        border-radius:16px;
    }


    .vct-support-status{
        align-items:flex-start;
    }


    .vct-support-status strong{
        font-size:13px;
    }


    .vct-support-status small{
        font-size:10px;

        line-height:1.5;
    }


    .vct-region-list{
        display:none;
    }


    /* INQUIRY PANEL */

    .vci-panel{
        border-radius:21px;
    }


    .vci-header{
        padding:25px 21px 23px;
    }


    .vci-header h2{
        font-size:30px;

        letter-spacing:-.7px;
    }


    .vci-header p{
        font-size:13px;

        line-height:1.65;
    }


    .vci-response-badge{
        width:100%;
    }


    /* FORM */

    .vci-form{
        padding:25px 21px 0;
    }


    .vci-step-spacing{
        margin-top:25px;
    }


    .vci-control input,
    .vci-control select{
        height:50px;
    }


    .vci-control textarea{
        min-height:130px;
    }


    /* ACTION AREA */

    .vci-action-area{
        padding-bottom:25px;
    }


    .vci-action-buttons{
        width:100%;

        flex-direction:column;
    }


    .vci-submit-btn,
    .vci-whatsapp-btn{
        width:100%;
    }


    /* TRUST FOOTER */

    .vci-trust-footer{
        padding:18px 21px;

        flex-direction:column;
        align-items:stretch;

        gap:12px;
    }


    .vci-trust-divider{
        width:100%;
        height:1px;
    }


    .vci-trust-item{
        justify-content:flex-start;
    }

}


/* ============================================================
   06. SMALL MOBILE
============================================================ */

@media(max-width:480px){

    .vct-header h2{
        font-size:30px;
    }


    .vct-region-badge{
        max-width:125px;

        padding:6px 8px;

        font-size:8px;
    }


    .vct-actions{
        grid-template-columns:1fr 1fr 40px;
    }


    .vct-action-btn{
        height:40px;

        font-size:9px;
    }


    .vci-header h2{
        font-size:27px;
    }


    .vci-header,
    .vci-form{
        padding-left:17px;
        padding-right:17px;
    }


    .vci-trust-footer{
        padding-left:17px;
        padding-right:17px;
    }

}


/* ============================================================
   07. EXTRA SMALL DEVICES
============================================================ */

@media(max-width:370px){

    .vct-card{
        padding:16px;
    }


    .vct-card-top{
        align-items:flex-start;
    }


    .vct-avatar{
        width:50px;
        height:50px;

        border-radius:14px;

        font-size:13px;
    }


    .vct-actions{
        grid-template-columns:1fr 1fr;
    }


    .vct-action-mail{
        grid-column:1 / -1;

        width:100%;
    }


    .vci-header h2{
        font-size:25px;
    }


    .vci-step-heading{
        align-items:flex-start;
    }

}


/* ============================================================
   08. ACCESSIBILITY / REDUCED MOTION
============================================================ */

@media(prefers-reduced-motion:reduce){

    .vct-card,
    .vct-avatar,
    .vct-card-accent,
    .vct-detail-link,
    .vct-action-btn,
    .vci-submit-btn,
    .vci-submit-btn i,
    .vci-whatsapp-btn{
        transition:none;
    }


    .vct-status-dot{
        animation:none;
    }

}


/* ============================================================
   TYPOGRAPHY READABILITY IMPROVEMENTS
============================================================ */

/* TEAM SECTION */

.vct-eyebrow div{
    font-size:12px;
}

.vct-region-badge{
    font-size:11px;
}

.vct-region-badge i{
    font-size:12px;
}

.vct-role{
    font-size:11px;
}

.vct-person-content h3{
    font-size:21px;
}

.vct-person-content p{
    font-size:14px;
    line-height:1.7;
}

.vct-detail-link small{
    font-size:10px;
}

.vct-detail-link strong{
    font-size:12px;
}

.vct-action-btn{
    font-size:12px;
}

.vct-support-status small{
    font-size:12px;
}

.vct-region-list span{
    font-size:10px;
}


/* INQUIRY SECTION */

.vci-eyebrow{
    font-size:11px;
}

.vci-header p{
    font-size:15px;
}

.vci-response-badge strong{
    font-size:13px;
}

.vci-response-badge span{
    font-size:11px;
}

.vci-step-heading strong{
    font-size:14px;
}

.vci-step-heading small{
    font-size:11px;
}

.vci-field label{
    font-size:12px;
}

.vci-control input,
.vci-control select,
.vci-control textarea{
    font-size:14px;
}

.vci-submit-btn,
.vci-whatsapp-btn{
    font-size:14px;
}

.vci-privacy-note{
    font-size:11px;
}

.vci-trust-item strong{
    font-size:12px;
}

.vci-trust-item span{
    font-size:10px;
}


/* MOBILE READABILITY */

@media(max-width:767px){

    .vct-eyebrow div{
        font-size:10px;
    }

    .vct-region-badge{
        font-size:10px;
    }

    .vct-person-content p{
        font-size:14px;
    }

    .vct-detail-link strong{
        font-size:12px;
    }

    .vct-action-btn{
        font-size:11px;
    }

    .vct-support-status small{
        font-size:11px;
    }

    .vci-header p{
        font-size:14px;
    }

    .vci-control input,
    .vci-control select,
    .vci-control textarea{
        font-size:14px;
    }
}

@media(max-width:480px){

    .vct-region-badge{
        font-size:9px;
    }

    .vct-action-btn{
        font-size:10px;
    }
}