/*
Custom CSS for Hello Elementor Child Theme.
Structure: all DESKTOP / base styles first, then every responsive
@media and @supports rule grouped together at the BOTTOM of the file
(ordered from the largest breakpoint down to the smallest).
*/
/*********/
.av-new-desion-section, .postid-23917 .av-old-desion-section{
    display: none;
}
.postid-23917 .av-new-desion-section{
    display: block;
}
.av-casestudy-gradient-text{
	background: linear-gradient(91deg, #366ADF 1.06%, #46BAE3 45.97%);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.casestudy-banner-right-section{
    backdrop-filter: blur(50px);

}
.cta-casestudy-backdrop-filter-sec {
    position: relative;
    z-index: 1;
    max-width: 100%;
    width: 100%; 
    border-radius: 30px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: rgba(255, 255, 255, 0.03);
    backdrop-filter: blur(50px);
    -webkit-backdrop-filter: blur(20px);
}
/* Button */
.avh-gradient-border-sec .elementor-button {
    position: relative;
    background: #fff;  
    color: #000;
    border: 0;
    border-radius: 8px;
    overflow: hidden;
    z-index: 1;
}

/* Gradient Border */
.avh-gradient-border-sec .elementor-button::before {
    content: "";
    position: absolute;
    inset: 0;
    padding: 1px; 
    border-radius: inherit;
    background: linear-gradient(90deg, rgba(54, 106, 223, 1), rgba(70, 186, 227, 1), rgba(76, 183, 163, 1));
 
    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
            mask-composite: exclude;

    pointer-events: none;
    z-index: -1;
}
.avh-gradient-border-sec .elementor-button:hover::before {
    opacity: 1;
}
/*********/
/***common hubspot css start**/
.av-hubspot-form,
.av-hubspot-form .hs-form,
.av-hubspot-form .hs-button{
    font-family:'Manrope',-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
}

/* column grid  */
.av-hubspot-form form.hs-form{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:20px;
}
.av-hubspot-form .hs-form-field{ margin:0 !important; }
.av-hubspot-form .hs-form-field .input{ margin:0 !important; }

/* textarea + submit + errors span full width */
.av-hubspot-form .hs-fieldtype-textarea,
.av-hubspot-form .hs_submit,
.av-hubspot-form .hs_error_rollup,
.av-hubspot-form .legal-consent-container{ grid-column:1 / -1; }

/* hide labels on text/email — placeholder carries the name */
.av-hubspot-form .hs-fieldtype-text > label,
.av-hubspot-form .hs-fieldtype-select > label{
    position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0);
}
/* show the Message label (bold, above box) */
.av-hubspot-form .hs-fieldtype-textarea > label{
    display:block !important;
    font-size:16px; font-weight:700; color:#15171C; margin:0 0 8px;
}
.av-hubspot-form .hs-form-required{ color:#15171C; margin-left:2px; }

.av-hubspot-form .hs-input{
    width:100% !important;
    box-sizing:border-box;
    background:#fff;
    border:1px solid #ccc;
    color: #666;
    font-family: Arial;
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 22px;
    border-radius:14px;
    padding:15px 18px;
    transition:border-color .18s ease, box-shadow .18s ease;
}
.av-hubspot-form .hs-input::placeholder{ color:#666; }
.av-hubspot-form textarea.hs-input{ min-height:110px; resize:vertical; }
.av-hubspot-form .hs-input:focus{
    outline:0;
    border-color:#1E6BFF;
    box-shadow:0 0 0 3px rgba(30,107,255,.15);
}
.av-hubspot-form .hs-input.invalid.error{ border-color:#E5484D; }

.av-hubspot-form .hs-error-msgs{ list-style:none; margin:6px 0 0; padding:0; }
.av-hubspot-form .hs-error-msg{ color:#E5484D; font-size:13px; }

.av-hubspot-form .hs_submit .actions{ margin:0; padding:0; }
.av-hubspot-form .hs-button.primary,
.av-hubspot-form input[type=submit].hs-button{
    width:100%;
    display:block;
    border:0;
    cursor:pointer;
    border-radius:14px;
    padding:18px 30px;
    font-size:20px;
    font-weight:700;
    color:#fff;
    background:linear-gradient(90deg,#003EB2 0%,#0051E9 50%,#4CB7A3 100%);
    transition:transform .18s ease, box-shadow .18s ease, filter .18s ease;
}
.av-hubspot-form .hs-button.primary:hover{
    filter:brightness(1.05);
    box-shadow:0 10px 28px rgba(40,160,170,.35);
    transform:translateY(-1px);
}

.av-hubspot-form .submitted-message{ text-align:center; font-weight:600; color:#15171C; }
/***common hubspot css end**/

/***hubspot css start**/
.hs_0-2\/name.hs-0-2\/name.hs-fieldtype-text.field.hs-form-field { width: 100% !important;}
label.hs-error-msg.hs-main-font-element {
    color: red;
}
.pum-theme-15361 .pum-content + .pum-close, .pum-theme-cutting-edge .pum-content + .pum-close {
    position: absolute;
    height: 24px;
    width: 24px;
    left: auto;
    right: 0px;
    bottom: auto;
    top: 0px;
    padding: 0px;
    color: #fff;
    font-family: Times New Roman;
    font-weight: 100;
    font-size: 32px;
    line-height: 24px;
    border: 1px none #ffffff;
    border-radius: 0px;
    box-shadow: -1px 1px 1px 0px rgba(2, 2, 2, 0.10);
    text-shadow: -1px 1px 1px rgba(0, 0, 0, 0.10);
    background-color: #000 !important;
}
.pum-theme-15361 .pum-container, .pum-theme-cutting-edge .pum-container {
    padding: 18px;
    border-radius: 0px;
    border: 1px none #000000;
    box-shadow: 0px 10px 25px 0px rgba(2, 2, 2, 0.50);
    background-color: #333 !important;
}
.avahi-hbspt-section{
	backdrop-filter: blur(2px);

}
.avahi-hbspt-section label {
    color: #232323;
    font-family: Manrope;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 20px;
}

/***Home page css start***/
/* Outer section box */
.elementor-element-560bc29.voice-ai-sec {
    position: relative;
    background: rgba(255, 255, 255, 0.01);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 24px;
    overflow: hidden;
    z-index: 1;
}

/* Soft blue glow on the left side of the section, like the Figma mock */
.elementor-element-560bc29.voice-ai-sec::before {
    content: "";
    position: absolute;
    left: -10%;
    top: 20%;
    width: 50%;
    height: 80%;
    background: radial-gradient(
        ellipse at left center,
        rgba(72, 143, 220, 0.35) 0%,
        rgba(72, 143, 220, 0.12) 45%,
        rgba(0, 0, 0, 0) 75%
    );
    filter: blur(40px);
    pointer-events: none;
    z-index: -1;
}
.voice-ai-sec{
	background: rgba(255, 255, 255, 0.01);
backdrop-filter: blur(0px);
}
.gradient-innovation-text{
	background: linear-gradient(90deg, #366ADF 0.16%, #46BAE3 47.78%);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.gradient-textroi-tech span{
	background: linear-gradient(90deg, #366ADF 45.17%, #46BAE3 51.62%);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
font-family: Manrope;
font-size: 32px;
font-style: normal;
font-weight: 600;
line-height: 40px;
text-transform: capitalize;
}
.vision-right-backdrop-filter{
	backdrop-filter: blur(10px);
}
.vision-section {
    backdrop-filter: blur(50px);
}
.vision-section{
	backdrop-filter: blur(0px);
}
/* ===== Section wrapper ===== */
.cta-filter-backdrop-sec {
    position: relative;
}

/* ===== Card ===== */
.cta-filter-backdrop-sec__card {
    position: relative;
    z-index: 1;
    max-width: 640px;
    width: 100%;
    padding: 32px 36px;
    border-radius: 24px;

    background: rgba(10, 16, 32, 0.72);
    border: 1px solid rgba(255, 255, 255, 0.08);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
}

/* ===== Soft glow BEHIND the card (smaller, offset, low opacity) ===== */
.cta-filter-backdrop-sec__card::before {
    content: "";
    position: absolute;
    z-index: -1;

    /* not full-size — a blob biased to the top-right like Figma */
    top: -40%;
    right: -10%;
    height: 160%;

    border-radius: 536px;
    background: linear-gradient(262deg, #78C7E3 11.92%, #004FE1 57.57%);
    filter: blur(95px);
    opacity: 0.35;          /* key change — was way too bright */
    pointer-events: none;
}
.gradient-textroi span, .gradient-banner-text{
	background: linear-gradient(270deg, #78C7E3 18.68%, #488FDC 71.15%);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.three-box-blur{
	backdrop-filter: blur(15px);
}
/***Home page css end***/
/***POC page css start***/
.elementor-element-358620b, .elementor-element-85ad5ce, .cta-backdrop-filter{
	    backdrop-filter: blur(50px);
}
.why-avahi-sec{
	backdrop-filter: blur(10px);
}
.gradient-color-this-sec{
	background: linear-gradient(90deg, #366ADF 0.16%, #46BAE3 50%);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.elementor-element-7dbde9a {
	  border-radius: 40px;
background: rgba(255, 255, 255, 0.03);
backdrop-filter: blur(50px);
}
.elementor-element.elementor-element-6c7d1d2.e-con-full.e-flex.e-con.e-child {
    backdrop-filter: blur(50px);
}
/* ── Add in WPCode ── */

.timeline-section-bg-border {
    position: relative !important;
    overflow: visible !important;
}

.timeline-section-bg-border::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 16px; /* must match your Elementor container border-radius exactly */
    padding: 1px;        /* 1px = thin border like Image 2 */
    background-image: url("https://avahi.ai/wp-content/uploads/2026/06/Rectangle-34-1.png");
    background-size: cover;
    background-position: center;

    -webkit-mask: linear-gradient(#fff 0 0) content-box,
                  linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;

    pointer-events: none;
    z-index: 0;
}

.timeline-section-bg-border > .e-con-inner {
    position: relative;
    z-index: 1;
}
.gradient-color-text{
	background: linear-gradient(90deg, #78C7E3 0.15%, #46BAE3 8.99%);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.gradient-offer-text{
	background: linear-gradient(90deg, #366ADF 45.17%, #46BAE3 51.62%);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
/***POC page css end***/
/**event page css start**/
.event-banner span {
    background: linear-gradient(90deg, #366ADF 0.16%, #46BAE3 50%, #4CB7A3 99.84%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.event-on-demand{
	background: linear-gradient(90deg, #366ADF 0.16%, #46BAE3 50%);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}


/**event page css end**/
#e-n-menu-title-1247 {
    display: none;
}
/** Avahi Top header CSS**/
.elementor-element.elementor-element-c55ffde{
	background: linear-gradient(89deg, rgba(0, 62, 178, 0.70) 1.26%, rgba(0, 81, 233, 0.70) 45.98%, rgba(76, 183, 163, 0.70) 90.69%);
backdrop-filter: blur(10px);
}

.elementor-element.elementor-element-bafbebf{
	border-bottom: 1px solid rgba(255, 255, 255, 0.20);
background: rgba(255, 255, 255, 0.01);
backdrop-filter: blur(10px);
}

/**Avahi contact button css**/

.elementor-element .elementor-element-3c9c882{
    position: relative;
    display: inline-block;
    /*padding: 15px 30px;*/
    border-radius: 50px;

    /* Transparent background */
    background: transparent;



    /* Remove default border */
    border: none;

    /* Needed for gradient border effect */
    z-index: 1;
    overflow: hidden;
}

.elementor-element .elementor-element-3c9c882::before, .how-it-work-btn-sec::before  {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 150px;
    padding: 2px;
    background: linear-gradient(90deg, #366ADF, #46BAE3, #4CB7A3);

    /* Creates transparent center */
    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);

    -webkit-mask-composite: xor;
            mask-composite: exclude;

    z-index: -1;
}

/* Hover Effect*/
.elementor-element .elementor-element-3c9c882:hover {
    color: #00f0ff;
    transition: 0.3s ease;
}

/**Avahi AI PoC Development Services on AWS pagecss start***/
.elementor-19725 .elementor-element.elementor-element-78b4efb::before{
	    background-image: linear-gradient(135deg, #46BAE3 0%, #3086E3 50%, #3161CC 100%) !important;
}
/**css end***/
/***Case Studies css start**/
.case-study-list-style {
  list-style: none;
  padding: 0;
  margin: 0;
}

.case-study-list-style li {
  display: inline;
}

.case-study-list-style li:not(:last-child)::after {
  content: ", ";
}
.case-study-list-style li {
    color: #fff;
}
.ms-content-list ul li {
    margin-bottom: 15px;
}
.ms-content-list ::marker {
    color: #3989e0;
}
.ms-case-study-content-area .wp-caption-text {
    color: #fff;
    text-align: center;
    margin-top: 10px;
}
.ms-case-study-content-area img {
  border-radius: 10px;
}
.ms-case-study-content-area .code-block {
  background: #0f172a;
  color: #e2e8f0;
  padding: 18px;
  border-radius: 10px;
  overflow-x: auto;
  margin: 15px 0;
  font-size: 14px;
  line-height: 1.6;
  position: relative;
  border: 1px solid #1e293b;
}

.ms-case-study-content-area .code-block::before {
  content: attr(data-lang);
  position: absolute;
  top: 8px;
  left: 12px;
  font-size: 11px;
  color: #94a3b8;
}

.ms-case-study-content-area .copy-btn {
  position: absolute;
  top: 8px;
  right: 10px;
  background: #1e293b;
  color: #e2e8f0;
  border: none;
  padding: 5px 10px;
  font-size: 12px;
  border-radius: 6px;
  cursor: pointer;
}

/****/
.case-studies-banner-cta {
    background: linear-gradient(98deg, rgba(25, 68, 162, 0.85) 0%, rgba(49, 97, 204, 0.85) 25%, rgba(53, 103, 218, 0.7) 50%, rgba(98, 142, 154, 0.7) 70%, rgba(130, 169, 102, 0.8) 90%, rgba(144, 179, 82, 0.85) 100%);
    backdrop-filter: blur(8px);
    border-radius: 12px;
}

.icon-timeline {
    position: relative;
}

.icon-timeline::before {
    content: "";
    position: absolute;
    left: 22px;
    top: 0;
    width: 4px;
    height: var(--line-height, calc(100% - 80px));
	    background: linear-gradient(181deg, rgba(54, 106, 223, 0.2) 0%, rgba(54, 106, 223, 0.8) 30.2%, rgba(144, 179, 82, 0.8) 100%);
/*     background-image: url("https://avahi.ai/wp-content/uploads/2026/03/line-border.png"); */
    background-repeat: repeat-y;
    background-size: contain;
    z-index: 0;
}
/***Case Studies css end**/
form#hsForm_c1007ade-41fb-4fc9-86f4-b3a0df71031d fieldset.form-columns-0 {
    max-width: 100%;
    padding-bottom: 20px;
}
form#hsForm_c1007ade-41fb-4fc9-86f4-b3a0df71031d fieldset.form-columns-0 p {
    font-size: 24px;
}
form#hsForm_c1007ade-41fb-4fc9-86f4-b3a0df71031d h2 {
    font-size: 31px;
}
.pum-theme-15357, .pum-theme-default-theme {
    background-color: #000000c2;
}
div#popmake-18409 {
    background: linear-gradient(#000, #000) padding-box, linear-gradient(to right, #90b352, #1d87e4) border-box !important;
    border-radius: 30px;
    border: 2px solid transparent;
	    box-shadow: 6px 14px 38px 0 #000000 !important;
}
div#popmake-18409 button.pum-close.popmake-close {
    border-radius: 30px !important;
    background: transparent;
    color: #fff !important;
    right: 8px;
    top: 3px;
}
form#hsForm_c1007ade-41fb-4fc9-86f4-b3a0df71031d p {
    font-size: 15px !important;
    line-height: 30px;
    padding-top: 10px;
}
form#hsForm_c1007ade-41fb-4fc9-86f4-b3a0df71031d .form-columns-2 {
    width: 100% !important;
    max-width: 100% !important;
}

form#hsForm_c1007ade-41fb-4fc9-86f4-b3a0df71031d .input {
    background: linear-gradient(90deg, #1d87e4, #90b352) !important;
    border-radius: 25px !important;
    height: 52px !important;
    margin-bottom: 20px !important;
    padding: 1px !important;
}

form#hsForm_c1007ade-41fb-4fc9-86f4-b3a0df71031d input {
    height: 50px !important;
    border-radius: 25px !important;
    background: #000 !important;
	color: #fff !important;
}

form#hsForm_c1007ade-41fb-4fc9-86f4-b3a0df71031d input.hs-button.primary.large
 {
    background: #90b352 !important;
    border-color: #90b352 !important;
    color: #000 !important;
    margin-top: 0px !important;
    width: 100% !important;
    height: 59px !important;
    text-transform: uppercase;
    font-weight: 700 !important;
}
form#hsForm_c1007ade-41fb-4fc9-86f4-b3a0df71031d .actions {
    height: 87px !important;
    margin-top: 20px;
}
form#hsForm_c1007ade-41fb-4fc9-86f4-b3a0df71031d .hs-error-msgs.inputs-list label {
    color: red;
    font-size: 12px !important;
    font-weight: 600;
}
form#hsForm_c1007ade-41fb-4fc9-86f4-b3a0df71031d ul
 {
    list-style: none;
    padding-left: 14px;
}




/*Popup*/
.pum-theme-15357 .pum-title, .pum-theme-default-theme .pum-title{
	display:none !important;
}
.pum-container.pum-responsive.pum-responsive-medium {
    margin-left: -16%;
    width: 33%;
}
    .pum-theme-15357 .pum-container, .pum-theme-default-theme .pum-container {
    padding: 30px;
    border-radius: 20px;
    border: 1px none #000;
    box-shadow: 1px 1px 3px 0 rgba(2, 2, 2, .23);
    background-color: #000 !important;
}
.pum-theme-15357 .pum-content+.pum-close, .pum-theme-default-theme .pum-content+.pum-close {
    position: absolute;
    height: auto;
    width: auto;
    left: auto;
    right: 0;
    bottom: auto;
    top: 0;
    padding: 0px 10px;
    color: #000;
    font-family: inherit;
    font-weight: 700;
    font-size: 20px;
    font-style: inherit;
    line-height: 36px;
    border: 1px none #fff;
    border-radius: 0;
    box-shadow: 1px 1px 3px 0 rgba(2, 2, 2, .23);
    text-shadow: 0 0 0 rgba(0, 0, 0, .23);
    background-color: #fff;
}


/*Popup*/
/* Global Css */
/* Gradient Button Css Start*/
.ys-gradient-btn a {
  position: relative;
  z-index: 1;
  padding: 14px 36px;
  border-radius: 50px;
  color: #fff;
  background: linear-gradient(130deg, #1D87E4, #90B352);
	border: none !important;
	line-height: 1.2em !important;
	transition: 0.4s ease-in-out;
}

.ys-gradient-btn a::before {
  content: "";
  position: absolute;
  top: 2px;
  left: 2px;
  right: 2px;
  bottom: 2px;
  background-color: #060606;
  border-radius: 50px;
  z-index: -1;
	transition: 0.4s ease-in-out;
}

.ys-gradient-btn a:hover {
  color: #fff !important;
}

.ys-gradient-btn a:hover::before {
  background-color: transparent;
}
/* Gradient Button Css End*/
/* Fill Button Css Start */
.ys-fill-btn a {
	background-color: #fff !important;
	color: #000 !important;
}

.ys-fill-btn a svg {
	fill: #fff;
}

.ys-fill-btn a:hover {
	background-color: transparent !important;
	color: #fff !important;
}
/* Fill Button Css End */

/*Bottom Blue Box Form css*/
.ys-form input {
    height: 70px;
    padding: 25px !important;
}

.ys-form input::placeholder {
    opacity: 1 !important;
}

.ys-form input:focus {
    border-color: #fff !important;
}

#form-btn {
    position: absolute;
    right: -50%;
    top: -180px;
}

/*Gradient text Css How IT Works Section*/
.ys-gradient-text {
    background: -webkit-linear-gradient(200deg, #90B352, #1D87E4) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}

.ys-icon-box h5 {
    margin-top: 0 !important;
}


/*Homepage slider CSS*/

/*Iconbox Css*/
.ys-icon-box h3 {
    margin-top: 0 !important;
}

/*Slider Css*/
/* .ys-slider .swiper-wrapper {
    transition-timing-function: linear !important;
} */

/*AI Solutions Slider*/
.ys-ai-slider .e-con-inner {
    justify-content: end !important;
}

.ys-main-wrapper {
    height: 400px !important;
}

.ys-main-card {
    height: 350px;
    transition: all 0.5s
    ease-in-out !important;
}

.ys-main-card:hover {
    height: 400px;
   transition: all 0.5s
    ease-in-out;
}

/*Header CSS Start*/
.mk-btn svg {
  padding-left: 5px;
    font-size:26px;
	fill: transparent !important;
	position: relative;
	top: 1px;
}
.mk-btn:hover svg {
   filter: invert(1);
}
.mk-list .elementor-icon-list-item .elementor-icon-list-icon svg {
  transition: transform 0.4s ease, fill 0.4s ease !important;
	transform-origin: center center !important;
}

.mk-list .elementor-icon-list-item:hover .elementor-icon-list-icon svg {
  transform: rotate(45deg) !important;

	filter: invert(1) !important;
}

/*Industries Pages  CSS Start*/
 .mk-carousal .swiper-wrapper {
    -webkit-transition-timing-function: linear !important;
    transition-timing-function: linear !important;
}
/*Industries Pages  CSS End*/

.ys-btn a {
    font-size: 1rem !important;
    line-height: 1.4em !important;
    text-align: left !important;
}

.ys-btn a::before {
    background: #000;
}

.ys-hero-heading .elementor-heading-title {
	text-transform: none !important;
}

.ys-logo-slider img {
    filter: grayscale(100%) brightness(70%);
  transition: filter 0.3s ease;
}

.ys-logo-slider img:hover {
    filter: grayscale(0%)brightness(100%);
}

/* 19/08/25 styling  */
ul.solution-lists p {
    margin-bottom: 0px;
}

/* Parent list item with custom tick */
.ys-content-list ul li {
  display: list-item !important;
  position: relative;
  padding-left: 44px;       /* space for tick */
  margin-bottom: 20px;
  list-style: none;
}

/* Custom tick icon */
  .ys-content-list ul li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0.25em;
  width: 25px;
  height: 25px;
  border-radius: 50%;
  background-image: url('/wp-content/uploads/2025/05/group_34.webp');
  background-repeat: no-repeat;
  background-position: center;
  background-size: 24px;
}

/* Inner UL — always block below the parent */
.ys-content-list ul li > ul,
.ys-content-list ul li > ol {
  display: block !important;   /* force block so it breaks to new line */
  width: 100%;                 /* take full width under text */
  margin: 0.5em 0 0 44px;      /* indent same as text */
  padding-left: 1em;
  list-style-type: circle;     /* or whatever style */
}

.wpml-ls-flag {
	width: 20px !important;
  margin-right: 7px;
}


/* ================================================================
   RESPONSIVE — all @media / @supports below the desktop CSS
   (ordered from the largest breakpoint down to the smallest)
================================================================ */

@media (max-width:1700px) and (min-width:1368px) {
    .mk-card-slider .elementor-swiper-button-prev{
        margin-left: -15px;
    }
}

@media (max-width: 1100px) {
    .ys-form-para {
        --container-widget-width: 29% !important;
    }
}

@media (max-width: 1024px) {
    form#hsForm_0869a50d-fe8a-4f75-af1a-b5014055ac17 .hs-form-field {
        width: 100% !important;
    }
    #form-btn {
        position: relative !important;
        top: 0 !important;
        left: 0;
    }
    #e-n-menu-title-1247 {
        display: block;
    }
    /* 	#e-n-menu-title-1247 .e-n-menu-title-container.e-focus.e-link {
        border-style: solid;
        border-width: 2px 2px 2px 2px;
        border-color: var(--e-global-color-primary);
        border-radius: 50px 50px 50px 50px;
        padding: 18px 28px 18px 28px;
        background-color: #fff !important;
        color: #000 !important;
    } */
}

/* Tablet */
@media (max-width: 980px) {
    .ys-content-list ul li {
        padding-left: 36px;
        margin-bottom: 16px;
    }
    .ys-content-list ul li::before {
        width: 20px;
        height: 20px;
        background-size: 18px;
    }
    .ys-content-list ul li > ul,
    .ys-content-list ul li > ol {
        margin-left: 36px;         /* match parent padding */
    }
}

@media (max-width: 650px) {
    .ys-main-wrapper {
        height: 350px !important;
    }
    .ys-main-card {
        height: 300px;
        transition: all 0.5s ease-in-out !important;
    }
    .ys-main-card:hover {
        height: 350px;
        transition: all 0.5s ease-in-out;
    }
}

@media (max-width:600px){
    .av-hubspot-form{ padding:28px; }
    .av-hubspot-form form.hs-form{ grid-template-columns:1fr; }
}

/* Mobile */
@media (max-width: 480px) {
    .ys-content-list ul li {
        padding-left: 30px;
        margin-bottom: 14px;
    }
    .ys-content-list ul li::before {
        width: 18px;
        height: 18px;
        background-size: 16px;
    }
    .ys-content-list ul li > ul,
    .ys-content-list ul li > ol {
        margin-left: 0px;
    }
}

@supports (-webkit-touch-callout: none) {
    @media (max-width: 430px) {
        .case-study-heading h3 {
            word-spacing: 2px !important;
            letter-spacing: 0.3px !important;
        }
    }
}

/* ================================================================
   CASE STUDY SLIDER  —  [case_study_slider]
   Proper card slider powered by Swiper (3 per view, loop, autoplay).
   Swiper controls layout/movement; the rules here are card visuals only.
================================================================ */
.csx-slider{
    position: relative;
    width: 100%;
    overflow: hidden;
}
/* Fallback row so cards don't stack vertically before Swiper CSS loads. */
.csx-track{
    display: flex;
}
.csx-slider .swiper-slide{
    height: auto;   /* stretch cards to equal height */
}

.csx-card{
    display: flex;
    width: 100%;
    height: 100%;
    border-radius: 20px;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.02);
    border: 1px solid rgba(255, 255, 255, 0.10);
}
.csx-card-link{
    width: 100%;
    display: flex;
    flex-direction: column;
    height: 100%;
    text-decoration: none !important;
    color: inherit;
}
.csx-media{
    display: block;
    width: 100%;
    aspect-ratio: 16 / 10;
    background-color: #0c1630;
    background-size: cover;
    background-position: center;
}
.csx-body{
    display: flex;
    flex-direction: column;
    gap: 14px;
    flex: 1;
    padding: 20px 22px 24px;
}
.csx-tags{
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-self: flex-start;
}
.csx-tag{
    position: relative;
    align-self: flex-start;
    padding: 7px 16px;
    border-radius: 999px;
    color: #fff;
    font-family: Manrope, sans-serif;
    font-size: 13px;
    font-weight: 500;
    line-height: 1;
    white-space: nowrap;
}
/* Gradient border ring (transparent interior) — #78C7E3 → #488FDC */
.csx-tag::before{
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    padding: 1px;                 /* border thickness */
    background: linear-gradient(90deg, rgba(120, 199, 227, 1) 0%, rgba(72, 143, 220, 1) 100%);
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
            mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
            mask-composite: exclude;
    pointer-events: none;
}
.csx-title{
    margin: 0;
    color: #fff;
    font-family: Manrope, sans-serif;
    font-size: 19px;
    font-weight: 600;
    line-height: 1.35;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.csx-read{
    margin-top: auto;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #3989e0;
    font-family: Manrope, sans-serif;
    font-size: 15px;
    font-weight: 600;
}
.csx-read svg{
    width: 16px;
    height: 16px;
    transition: transform 0.2s ease;
}
.csx-card:hover .csx-read svg{ transform: translateX(4px); }

/* Case study slider — responsive (cards-per-view handled by Swiper breakpoints) */
@media (max-width: 600px){
    .csx-title{ font-size: 17px; }
    .csx-body{ padding: 18px 18px 20px; }
}

/* ================================================================
   CASE STUDY TABLE OF CONTENTS  —  [case_study_toc]
   Sticky sidebar, auto-built from the body headings, active-on-scroll.
================================================================ */
/* Elementor containers clip overflow, which silently breaks position:sticky.
   Force the sticky ancestor chain (the main section + its columns) to allow it,
   and let the TOC's own column stretch so the sticky has room to travel. */
.av-main-body-sec,
.av-main-body-sec > .e-con-inner,
.av-main-body-sec .e-con{
    overflow: visible !important;
}
/* The right column stretches to the article's height so the TOC has room to pin. */
.av-casestudy-right-continer-body{
    align-self: stretch;
}
/* Sticky goes on the direct child of the tall column (the shortcode widget),
   NOT the inner nav — otherwise it can only travel inside its own tiny wrapper. */
.av-casestudy-right-continer-body > .elementor-widget-shortcode,
.av-casestudy-right-continer-body .elementor-widget-shortcode{
    position: -webkit-sticky;
    position: sticky;
    top: 120px;                 /* clears the fixed site header */
    align-self: flex-start;
}
.av-toc{
    position: -webkit-sticky;
    position: sticky;
    top: 120px;
    align-self: flex-start;
    max-height: calc(100vh - 140px);
    overflow-y: auto;
}
.av-toc-title{
    margin: 0 0 14px;
    color: #46BAE3;
    font-family: Manrope, sans-serif;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
}
.av-toc-list{
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
    border-left: 1px solid rgba(255, 255, 255, 0.12);
}
.av-toc-item{ margin: 0; }
.av-toc-link{
    display: block;
    padding: 8px 0 8px 16px;
    margin-left: -1px;                       /* sit on top of the list border */
    border-left: 2px solid transparent;
    color: rgba(255, 255, 255, 0.60);
    font-family: Manrope, sans-serif;
    font-size: 15px;
    font-weight: 500;
    line-height: 1.4;
    text-decoration: none !important;
    transition: color .2s ease, border-color .2s ease;
}
.av-toc-link:hover{ color: #fff; }
.av-toc-link.is-active{
    color: #46BAE3;
    border-left-color: #46BAE3;
    font-weight: 600;
}
/* nested indent when both h2 + h3 are listed */
.av-toc-link--h3{ padding-left: 30px; font-size: 14px; }

@media (max-width: 1024px){
    /* On smaller screens the TOC usually stacks above the content —
       drop the sticky so it scrolls normally with the page. */
    .av-casestudy-right-continer-body .elementor-widget-shortcode{ position: static; }
    .av-toc{ position: static; max-height: none; }
}
