.elementor-kit-19{--e-global-color-primary:#6EC1E4;--e-global-color-secondary:#54595F;--e-global-color-text:#7A7A7A;--e-global-color-accent:#61CE70;--e-global-typography-primary-font-family:"Roboto";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;}.elementor-kit-19 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){margin-block-end:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* Make the card a clipping context (works for Columns and Containers) */
.pricing-card,
.pricing-card > .elementor-widget-wrap,
.pricing-card > .e-con-inner{
position: relative;
overflow: hidden;
border-radius: inherit;
}

/* Tunables (desktop) */
.pricing-card{
--rb-angle: -33deg; /* tilt; 31–35deg if you need */
--rb-top: 70px; /* distance from top edge */
--rb-left: -30px; /* distance from left edge */
--rb-thick: 26px; /* ribbon thickness */
--rb-len: clamp(180px, 44%, 260px); /* ribbon length across the card */
--rb-fs: 13px; /* text size */
--rb-color: #ef3a35; /* ribbon color */
}

/* Top-left corner ribbon (with white lines) — support both engines */
.conn-1 .pricing-card > :is(.elementor-widget-wrap, .e-con-inner)::after,
.conn-2 .pricing-card > :is(.elementor-widget-wrap, .e-con-inner)::after,
.conn-3 .pricing-card > :is(.elementor-widget-wrap, .e-con-inner)::after{
content: var(--rb-label, "");
position: absolute;
top: var(--rb-top);
left: var(--rb-left);
height: var(--rb-thick);
width: var(--rb-len);
display: flex;
align-items: center;
justify-content: center;

background: var(--rb-color);
color: #fff;
font-weight: 800;
font-size: var(--rb-fs);
letter-spacing: .3px;

transform-origin: 0 0; /* anchor to TOP-LEFT */
transform: rotate(var(--rb-angle));

/* thin white lines above/below the strip */
box-shadow: 0 -4px 0 #fff inset, 0 4px 0 #fff inset;
border-radius: 4px;
z-index: 4;
pointer-events: none;
}

/* Label per template */
.conn-1 .pricing-card{ --rb-label: "1 Connection"; }
.conn-2 .pricing-card{ --rb-label: "2 Connections"; }
.conn-3 .pricing-card{ --rb-label: "3 Connections"; }

/* ========================
Responsive overrides
======================== */

/* Tablet (≤1024px) */
@media (max-width: 1024px){
.pricing-card{
--rb-top: 70px;
--rb-left: -48px;
--rb-thick: 20px;
--rb-len: clamp(230px, 50%, 240px);
--rb-fs: 12px;
--rb-angle: -33deg;
}
}

/* Large phones / small tablets (≤768px) */
@media (max-width: 768px){
.pricing-card{
--rb-top: 76px;
--rb-left: -70px;
--rb-thick: 20px;
--rb-len: clamp(235px, 58%, 230px);
--rb-fs: 11.5px;
--rb-angle: -33deg;
}
}

/* Small phones (≤480px) */
@media (max-width: 480px){
.pricing-card{
--rb-top: 70px;
--rb-left: -48px;
--rb-thick: 30px;
--rb-len: clamp(150px, 64%, 210px);
--rb-fs: 11px;
--rb-angle: -32deg; /* a touch flatter on tiny screens */
}
}
/*========================*/
/* ============================
PILL TABS (works on BOTH engines)
- New: e-n-tabs
- Legacy: elementor-widget-tabs
============================ */

.conn-switch{
/* theme variables */
--pill-bg: rgba(255,255,255,.10);
--pill-text: #fff;
--pill-border: rgba(255,255,255,.22);
--pill-hover-bg: #ed5651;
--pill-active-bg: #ef3a35;
--pill-active-text: #fff;
--pill-shadow: 0 6px 18px rgba(239,58,53,.28);
--pill-radius: 9999px;

/* auto-scaling size so text fits */
--pill-fsize: clamp(13px, 3.3vw, 18px);
--pill-pad-y: clamp(.40rem, 1.3vw, .55rem);
--pill-pad-x: clamp(.70rem, 2.2vw, 1.2rem);

--pill-gap: .65rem;
--pill-minw: 162px;
}

/* ---------- NEW TABS (e-n-tabs) ---------- */
.conn-switch .e-n-tabs__nav{
display:flex; justify-content:center; align-items:center;
gap:var(--pill-gap); border:0; background:transparent; padding:.5rem 0 1rem;
flex-wrap:wrap;
}
.conn-switch .e-n-tab-title{
appearance:none;
min-width:var(--pill-minw);
padding:var(--pill-pad-y) var(--pill-pad-x);
border-radius:var(--pill-radius);
font-weight:700; font-size:var(--pill-fsize); line-height:1.2;
display:inline-flex; align-items:center; justify-content:center;
cursor:pointer; transition:all .2s ease;
background:var(--pill-bg) !important;
color:var(--pill-text) !important;
border:1px solid var(--pill-border) !important;
}
.conn-switch .e-n-tab-title:hover,
.conn-switch .e-n-tab-title:focus{
background:var(--pill-hover-bg) !important;
border-color:rgba(255,255,255,.35) !important;
outline:none;
}
.conn-switch .e-n-tab-title[aria-selected="true"],
.conn-switch .e-n-tab-title.e-active{
background:var(--pill-active-bg) !important;
color:var(--pill-active-text) !important;
border-color:var(--pill-active-bg) !important;
box-shadow:var(--pill-shadow);
}
.conn-switch .e-n-tabs-content{ border:0; padding-top:.5rem; }

/* ---------- LEGACY TABS ---------- */
.conn-switch.elementor-widget-tabs .elementor-tabs-wrapper{
display:flex; justify-content:center; align-items:center;
gap:var(--pill-gap); border:0 !important; background:transparent; padding:.5rem 0 1rem;
flex-wrap:wrap;
}
.conn-switch.elementor-widget-tabs .elementor-tab-title,
.conn-switch.elementor-widget-tabs .elementor-tab-desktop-title{
min-width:var(--pill-minw);
padding:var(--pill-pad-y) var(--pill-pad-x);
border-radius:var(--pill-radius);
font-weight:700; font-size:var(--pill-fsize); line-height:1.2;
display:inline-flex; align-items:center; justify-content:center;
cursor:pointer; transition:all .2s ease;
background:var(--pill-bg) !important;
color:var(--pill-text) !important;
border:1px solid var(--pill-border) !important;
}
.conn-switch.elementor-widget-tabs .elementor-tab-title:hover,
.conn-switch.elementor-widget-tabs .elementor-tab-title:focus{
background:var(--pill-hover-bg) !important;
border-color:rgba(255,255,255,.35) !important;
}
.conn-switch.elementor-widget-tabs .elementor-tab-title.elementor-active{
background:var(--pill-active-bg) !important;
color:var(--pill-active-text) !important;
border-color:var(--pill-active-bg) !important;
box-shadow:var(--pill-shadow);
}
.conn-switch.elementor-widget-tabs .elementor-tabs-content-wrapper{
border:0 !important; padding-top:.5rem;
}

/* ======================================================
KILL THE MOBILE ACCORDION DUPLICATE HEADERS (both engines)
====================================================== */
.conn-switch :is(.elementor-tabs-content-wrapper, .e-n-tabs-content)
:is(.elementor-tab-title, .elementor-accordion, .e-n-accordion, .e-n-accordion__header){
display:none !important;
height:0 !important;
margin:0 !important;
padding:0 !important;
overflow:hidden !important;
border:0 !important;
}

/* =========================================
Keep buttons together on small screens
(1-line with horizontal scroll if needed)
========================================= */
@media (max-width: 600px){
.conn-switch .e-n-tabs__nav,
.conn-switch.elementor-widget-tabs .elementor-tabs-wrapper{
flex-wrap:nowrap;
overflow-x:auto;
-webkit-overflow-scrolling:touch;
scrollbar-width:none;
}
.conn-switch .e-n-tabs__nav::-webkit-scrollbar,
.conn-switch.elementor-widget-tabs .elementor-tabs-wrapper::-webkit-scrollbar{
display:none;
}
.conn-switch{ --pill-minw: 140px; --pill-gap: .5rem; }
}

/* General tablet tweaks */
@media (max-width:768px){
.conn-switch{
--pill-minw:150px;
--pill-fsize: clamp(13px, 2.6vw, 16px);
}
}

/* ======================================================
Phone “3-up” mode — fit EXACTLY three pills across.
Adjust the max-width value if you need this earlier/later.
====================================================== */
@media (max-width: 430px){
/* turn OFF the scroll behavior from the 600px rule */
.conn-switch .e-n-tabs__nav,
.conn-switch.elementor-widget-tabs .elementor-tabs-wrapper{
overflow-x:visible;
flex-wrap:nowrap;
justify-content:center; /* keep them centered as a group */
}

/* tighter spacing and smaller type/padding */
.conn-switch{
--pill-gap: .45rem;
--pill-fsize: clamp(12px, 3.4vw, 14px);
--pill-pad-x: clamp(.50rem, 1.6vw, .75rem);
--pill-pad-y: clamp(.34rem, 1.0vw, .46rem);
}

/* give each pill an exact width so three + 2 gaps = 100% */
.conn-switch :is(.e-n-tab-title, .elementor-tab-title, .elementor-tab-desktop-title){
flex: 0 0 calc((100% - 2 * var(--pill-gap)) / 3);
min-width: 0; /* allow shrinking inside the calc width */
}
}/* End custom CSS */