/*
Template:       neeon
Theme Name:     Neeon Child Theme
Theme URI:      http://radiustheme.com/demo/wordpress/themes/neeon
Author:         RadiusTheme
Author URI:     http://radiustheme.com
Description:    Neeon is an Responsive News, Blog & Magazine WordPress Theme.
Version:        1.0
Text Domain:    Neeon
Tags: theme-options, featured-images, post-formats, one-column, two-columns, right-sidebar, custom-background, custom-header, editor-style, sticky-post, threaded-comments, translation-ready
License:   	  Envato split License
License URI:  https://themeforest.net/licenses/terms/regular
*/

@keyframes toBottomFromTop2 {
  49% {
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	}
  50% {
	opacity: 0;
	-webkit-transform: translateY(50%);
	transform: translateY(50%);
	}
  51% {
	opacity: 1;
  }
}

.fa-x-twitter::before {
  content: "\e61b" !important;
}

#page {
  overflow-x: hidden;
}

body{
	font-size: 18px !important;
}


/* TOP BAR */

.site-header .main-navigation nav ul li a {
	font-family: 'Barlow', sans-serif !important;
	font-weight: 600;
}

.menu-wrap {
  	margin-left: auto; 
  	display: flex;
  	align-items: center;
  	margin-right: 20px; 
}

.header-top-bar .top-bar-wrap {
	justify-content: flex-end !important;
}

.site-branding {
	width: 270px;
}

.site-header .site-branding a img {
	max-width: 270px !important;
}

.mobile-logo {
    max-width: 200px;
    margin: 20px 0px;
}

.mean-container .mean-bar img {
    max-width: 200px !important;
}

.sidebarBtn .bar {
	background: #707070 !important;
}

.mean-container .mean-bar .search-icon a {
	color: #707070 !important;
}

/* GLOBAL */

.entry-banner {
	display: none;
}

.button-style-2 {
	border-radius: 8px !important;
}

.banner-image-container {
	padding: 0px !important;
}

.banner-image-container::after {
	content: "";
  	position: absolute;
  	top: 0; left: 0;
  	width: 100%; height: 100%;
  	background: rgba(0, 0, 0, 0.5); 
  	z-index: 1;
	pointer-events: none;
}

.banner-container {
	padding: 0px !important;
}

.banner-text-container {
	padding-left: 0px !important;
	padding-right: 0px !important;
}

@media (max-width: 1320px) and (min-width: 768px) {
	.title-paragraph {
		--width: 100% !important;
	}
}

/* HOMEPAGE */

.bouncing-bubble-animation {
	animation: none !important;
}

{
	align-self: flex-end !important;
}

.partner {
	min-height: 186px !important;
}

.events-section .e-loop-item {
	border-bottom: 1px solid #ccc;
  	padding-bottom: 5px;
  	margin-bottom: 5px;
}

.events-section .e-loop-item:last-child {
  border-bottom: none;
}

.elementor-8793 .elementor-element.elementor-element-26d081a {
	margin-top: auto;
}

.testimonial-name {
	margin-top: auto;
}

.elementor-icon-box-wrapper .elementor-icon {
	padding-top: 4px !important;
}

/* .elementor-icon-list-item .elementor-element {
	display: none !important;
}

.elementor-widget-post-info .elementor-element {
	display: none !important;
} */


/* @media (max-width: 768px) {
	.rt-post-overlay-style6 .rt-item-list {
	margin-left: 24px;
	}
} */
@media (max-width: 767px) {
    .elementor-8793 .elementor-element.elementor-element-83cdfc5 .rt-post-overlay-default ul.entry-meta {
        display: none;
    }
}

/* HERO */

.title-animation-black-normal a:hover {
	background-size: 0% 0px !important;
}

/* SERVICES */

.elementor-753 .elementor-element.elementor-element-5454ea3::before {
	position: absolute;
    top: 0;
    left: 0;
    width: 50%;
    height: 100%;
	z-index: 1;
    pointer-events: none;
}

/* CONTACT */

.contact a {
	font-size: 20px !important;
}

.contact p {
	font-size: 20px !important;
}

.contact {
	padding-left: 0px !important;
}

.rt-contact-info .rt-icon {
	background: none !important;
}

.elementor-widget-wp-widget-fluentform_widget h5 {
	font-family: 'Barlow', sans-serif;
	text-transform: uppercase;
	font-size: 30px !important;
	color: var(--e-global-color-primary);
	padding-bottom: 20px;
}

.location-icon .rt-icon {
	align-self: flex-start;
}

/* BUTTON */

.btn-common svg {
	display: none;
}

.button-style-2:hover {
	background-color: #1D69D3 !important;
	transition: background-color 0.3s ease;
}

.fluentform .contact-form .ff_btn_style:hover {
	background-color: #1D69D3 !important;
	transition: background-color 0.3s ease !important;
}

.button-style-2:before {
	display: none;
}

.banner-button:hover {
	color: #fff;
	background-color: #1D69D3;
	transition: background-color 0.3s ease;
}

#respond form .btn-send:hover {
	color: #fff;
	background-color: #1D69D3 !important;
	transition: background-color 0.3s ease;
}

/* .external-link-button .button-style-2::after {
  content: "";
  display: inline-block;
  width: 16px; 
  height: 16px; 
  background-image: url('/wp-content/uploads/2025/08/Group-689.png');
  background-size: contain;
  background-repeat: no-repeat;
  margin-left: 10px; 
  vertical-align: middle;
  transition: transform 0.3s ease;
} */
.external-link-button .button-style-2::after {
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  content: "\f35d";
  display: inline-block;
  font-size: 16px; 
  margin-left: 10px; 
  vertical-align: middle;
  transition: transform 0.3s ease;
}

/* BLOG */

.category-style {
	border-radius: 8px !important;
}

.entry-categories .category-style {
	background-color: #2F7FEF !important;
}

.post-box-style .entry-date {
	font-family: 'Barlow', sans-serif;
	text-transform: none !important;
}

.rt-post-overlay-default ul.entry-meta li {
	text-transform: none !important;
}

.rt-widget-title-holder h3 {
	font-family: 'Barlow', sans-serif !important;
	font-size: 30px !important;
	color: #2F7FEF !important;
}

.titledot {
	display: none !important;
}

.titleline {
	display: none;
}

.post-box-style .item-list {
	flex-direction: row-reverse;
	gap: 14px;
    justify-content: space-between;
}

.post-box-style .post-content .entry-title a {
	font-family: 'Barlow', sans-serif;
	font-weight: 600;
}

.entry-header .entry-title {
	font-family: 'Barlow', sans-serif;
	font-size: 40px;
	font-weight: 600;
}

.entry-header ul.entry-meta li {
	font-family: 'Barlow', sans-serif;
	text-transform: none !important;
}

.post-box-style .rt-news-box-widget {
	margin-bottom: 10px !important;
	padding-bottom: 10px !important;
	width: 100%;
}

.post-box-style .post-box-img .post-img::after {
	display: none !important;
}

.post-box-style .post-box-img .post-img {
	border-radius: 6px !important;
	width: 160px;
	height: 120px;
}

.post-box-style .post-box-img {
	margin-right: 0px !important;
}

.post-box-style .post-box-img .post-img img {
	border-radius: 6px !important;
	width: 160px !important;
	height: 120px !important;
	object-fit: cover;
}

@media (min-width: 1200px) {
	.col-xl-3.col-lg-8.mx-auto.fixed-bar-coloum {
		width: 30% !important;
	}
}

@media (min-width: 1200px) {
    .col-xl-9 {
        width: 70% !important;
    }
}

.elementor-12027 .elementor-element.elementor-element-0207a94 {
	padding: 0px;
}

.blog-grid .e-con {
	height: 100% !important;
}

.blog-grid .post-date {
	margin-top: auto !important;
  	align-self: flex-start !important;
}

.post-category {
	display: inline-block;
	background-color: #2F7FEF !important;
	color: #fff;
	font-family: 'Barlow', sans-serif;
	text-transform: uppercase;
	padding: 4px 16px;
	border-radius: 8px;
	font-size: 15px;
	font-weight: bold;
	margin-bottom: 10px;
}

.rt-post-overlay-default .rt-item .post-terms .category-style {
	background-color: #2F7FEF !important;
}

.categories-badge-grid .post-category {
	padding: 0px 20px !important;
	border-radius: 12px !important;
	font-size: 12px !important;
}

.single-post .main-wrap .entry-content p {
	font-family: 'Roboto', sans-serif;
	font-size: 20px;
	font-weight: 400;
	color: #2f2f2f;
}

.rt-category .rt-item .rt-cat-name {
	font-family: 'Barlow', sans-serif;
	text-transform: uppercase;
	font-size: 20px;
}

.rt-category-style2 .rt-item .rt-content {
	justify-content: center !important;
}

.post-box-style .entry-cat a {
	background-color: #2F7FEF !important;
	color: #fff !important;
	font-family: 'Barlow', sans-serif;
	text-transform: uppercase;
	padding: 4px 10px !important;
	border-radius: 6px !important;
	font-size: 12px !important;
}

.comment-reply-title {
	font-family: 'Barlow', sans-serif;
	text-transform: uppercase;
	color: #2F7FEF;
	font-weight: 600;
	font-size: 24px !important;
}

/* MEDIA PACK BANNER */

.media-pack-banner {
	position: relative;
	background: #1F5493 url('/wp-content/uploads/2025/06/devices14-8.png') center/cover no-repeat;
    background-blend-mode: multiply;
	border-radius: 12px;
	color: white;
	text-align: center;
	font-family: 'Roboto', sans-serif;
	font-size: 14px;
	overflow: hidden;
	padding: 80px 60px;
}

.banner-content {
  position: relative;
  z-index: 2;
}

.banner-features li {
	border-bottom: 0px !important;
	margin: 0px !important;
	padding-bottom: 5px !important;
	text-align: left;
}

.banner-features {
	margin-bottom: 40px !important;
}

.banner-intro {
	padding-top: 20px;
}

.banner-button {
	background-color: #2F7FEF;
	padding: 10px 20px;
	border-radius: 8px;
	color: #fff;
	font-family: 'Barlow', sans-serif;
	font-weight: 600;
	text-transform: uppercase;
	margin-top: 20px;
	font-size: 14px;
}

/* FOOTER */

.footer-area .copyright {
	text-align: left !important;
	font-family: 'Barlow', sans-serif;
}

.footer-content-area .widgettitle {
	font-family: 'Barlow', sans-serif;
	font-size: 30px;
}

.menu-item a::before {
	display: none;
}

.footer-top-area .widget ul.menu li a {
	padding-left: 0px !important;
}
.footer-area .footer-social li a{
	border-radius: 10px !important;
}
.footer-top-area ul li a i{
	font-size: 22px !important;
}
.footer-top-area ul li a:hover i {
    animation: toBottomFromTop2 0.5s forwards !important;
}

.footer-content-area .widgettitle {
	text-transform: uppercase;
}

@media (max-width: 768px) {
.footer-content-area .container {
	padding-left: 24px;
}
}

/* .widget.rt_footer_social_widget {
	display: flex;
	flex-direction: row;
	gap: 15px;
	align-items: center;
	justify-content: flex-end;
} */

/* .widget.rt_footer_social_widget .widgettitle {
	margin-bottom: 0px !important;
	color: #ffffff;
	font-family: 'Barlow', sans-serif;
	font-size: 20px;
	font-weight: 500;
} */

.widget.widget_fluentform_widget {
	margin-bottom: 0px !important;
}

.footer-content-area .row > div:nth-child(n+2) {
  margin-top: 105px; 
}

@media (max-width: 1199px) {
	.footer-content-area .row > div:nth-child(3), .footer-content-area .row > div:nth-child(4) {
	  margin-top: 0; 
	}
}

/* .footer-top-area::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 50%; 
  height: 100%;
  background: url('/wp-content/uploads/2025/05/MM.png') no-repeat center left;
  background-size: contain; 
  filter: grayscale(100%) opacity(0.1); 
  z-index: 0;
} */
.footer-top-area::before {
  content: "";
  position: absolute;
  top: 0;
  left: 2%;
  width: 64%;
  height: 100%;
  background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMTU0Ljk1MSA1MzMuODUiIHByZXNlcnZlQXNwZWN0UmF0aW89InhNaWRZTWlkIG1lZXQiPgogIDxnIGRhdGEtbmFtZT0iRm9vdGVyIEJhY2tncm91bmQiIG9wYWNpdHk9Ii4wMiIgZmlsbD0iI2ZmZiI+CiAgICA8cGF0aCBkYXRhLW5hbWU9IlBhdGggNDk0IiBkPSJNNDU2LjQyMyA2NC4wM2gyMy4wMTV2NDA1Ljc4OWgtMjAuODE3VjEwMi40MzhMMjgwLjEzMyAzNjMuMzY5IDEwMC44NTUgMTAyLjQzOHYzNjcuMzgxSDgwLjAzOFY2NC4wM2gyMC44MTdsMTc4LjE3OSAyNjEuNjg3Wk00MTguNiAwIDI4MC4zNzMgMjA1LjM4OCAxNDAuNTMgMEgwdjUzMy44NWgxNzAuNDg0VjM0MS43NTlsMTA5LjY0OSAxNjAuMDc2IDEwOC44NTgtMTYwLjA3NlY1MzMuODVoMTcwLjQ4NVYwWiIvPgogICAgPHBhdGggZGF0YS1uYW1lPSJQYXRoIDQ5NSIgZD0iTTEwNTEuODk5IDY0LjAzaDIzLjAxNXY0MDUuNzg5aC0yMC44MTdWMTAyLjQzOEw4NzUuNjA5IDM2My4zNjkgNjk2LjMyNiAxMDIuNDM4djM2Ny4zODFoLTIwLjgxMlY2NC4wM2gyMC44MTJMODc0LjUxIDMyNS43MTdaTTEwMTQuMDc4IDAgODc1Ljg0OSAyMDUuMzg4IDczNi4wMDYgMGgtMTQwLjUzdjUzMy44NUg3NjUuOTZWMzQxLjc1OWwxMDkuNjQ5IDE2MC4wNzYgMTA4Ljg1OC0xNjAuMDc2VjUzMy44NWgxNzAuNDg1VjBaIi8+CiAgPC9nPgo8L3N2Zz4=');
  background-repeat: no-repeat;
  background-position: left center;
  background-size: contain;
  filter: none;
  pointer-events: none;
  z-index: 0;
}

@media (max-width: 1199px) {
  .footer-top-area::before {
    width: 80%;
  }
}

@media (max-width: 768px) {
  .footer-top-area::before {
	  top: 50px;
    width: 80%;
    height: 100%;
    background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzNTQuMTIgNzMzLjI2NCIgcHJlc2VydmVBc3BlY3RSYXRpbz0ieE1pZFlNaWQgbWVldCI+CiAgPGcgZGF0YS1uYW1lPSJGb290ZXIgQmFja2dyb3VuZCAobW9iaWxlKSI+CiAgICA8ZyBkYXRhLW5hbWU9Ikdyb3VwIDQ2NSIgb3BhY2l0eT0iLjAyIj4KICAgICAgPHBhdGggZGF0YS1uYW1lPSJQYXRoIDQ5NCIgZD0iTTI4OC44OTMgNDAuNTI4aDE0LjU2N3YyNTYuODQ0aC0xMy4xNzZWNjQuODM4TDE3Ny4zMSAyMjkuOTk0IDYzLjgzNiA2NC44Mzh2MjMyLjUzNEg1MC42NlY0MC41MjhoMTMuMTc2bDExMi43NzggMTY1LjYzNFpNMjY0Ljk1NCAwbC04Ny40OTIgMTMwTDg4Ljk0OSAwSDB2MzM3LjloMTA3LjkwOFYyMTYuMzE2bDY5LjQgMTAxLjMyIDY4LjktMTAxLjMyVjMzNy45SDM1NC4xMlYwWiIgZmlsbD0iI2ZmZiIvPgogICAgPC9nPgogICAgPGcgZGF0YS1uYW1lPSJHcm91cCA1NzEiIG9wYWNpdHk9Ii4wMiI+CiAgICAgIDxwYXRoIGRhdGEtbmFtZT0iUGF0aCA0OTQiIGQ9Ik0yODguODkzIDQzNS44OTFoMTQuNTY3djI1Ni44NDRoLTEzLjE3NlY0NjAuMjAxTDE3Ny4zMSA2MjUuMzU3IDYzLjgzNiA0NjAuMjAxdjIzMi41MzRINTAuNjZWNDM1Ljg5MWgxMy4xNzZsMTEyLjc3OCAxNjUuNjM0Wm0tMjMuOTM5LTQwLjUyOC04Ny40OTIgMTMwLTg4LjUxMy0xMzBIMHYzMzcuOWgxMDcuOTA4VjYxMS42NzlsNjkuNCAxMDEuMzIgNjguOS0xMDEuMzJ2MTIxLjU4NEgzNTQuMTJ2LTMzNy45WiIgZmlsbD0iI2ZmZiIvPgogICAgPC9nPgogIDwvZz4KPC9zdmc+');
    background-position: center top;
    background-size: contain;
  }
}

.footer-style-2 .footer-area .widget_media_image {
	margin-bottom: 70px !important;
}

.footer-style-2 .footer-copyright-area {
	z-index: 8 !important;
	border: none !important;
	font-size: 14px !important;
}

.footer-contact {
  display: flex;
  flex-direction: column;
  gap: 12px; 
}

.contact-item {
  display: flex;
  align-items: flex-start;
}

.contact-item .icon {
  width: 20px;
  height: 20px;
  margin-right: 10px;
  flex-shrink: 0; 
}

.contact-item a {
  color: #ffffff;
  text-decoration: none;
  line-height: 1.5;
}



/* MOBILE */

@media (max-width: 768px) {
/*   .logo-scroll .elementor-loop-container {
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    scroll-snap-type: x mandatory;
     -webkit-overflow-scrolling: touch;
    gap: 20px;
    padding: 10px;
  }
  
  .logo-scroll .e-loop-item {
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: 180px;
    max-width: 220px;
    height: 100px;
    scroll-snap-align: start;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
  }
  
  .logo-scroll .e-loop-item img {
    width: 80%;
    max-width: 180px;
    height: auto;
    object-fit: contain;
    display: block;
	justify-self: center;
  } */
	
	.elementor-11755 .elementor-element.elementor-element-5af9d19 {
		min-height: 100px;
	}
	
	.partner {
		min-height: 100px !important;
	}
	
	.logo-scroll .elementor-heading-title {
		font-size: 34px !important;
	}
	
	.logo-scroll .elementor-loop-container::-webkit-scrollbar {
	  display: none;
	}
	
	.logo-scroll .elementor-loop-container {
	  -ms-overflow-style: none; 
	  scrollbar-width: none;     
	}

	.revert-container .elementor-container.elementor-column-gap-default {
		display: flex;
		flex-direction: column-reverse;
	}
	
	.revert-container .e-con-inner {
		display: flex !important;
		flex-direction: column-reverse;
	}
	
	.footer-content-area .row > div:nth-child(n+2) {
		margin-top: 0px !important;
	}
}



@media (max-width: 768px) {
    .container, .container-md, .container-sm {
        max-width: 900px !important;
    }
}

@media (min-width: 768px) and (max-width: 1400px) {
    .container, .container-lg, .container-md, .container-sm, .container-xl,
	.elementor-section.elementor-section-boxed > .elementor-container {
        padding-left: 32px !important;
        padding-right: 32px !important;
    }
}


.elementor-widget-loop-grid .e-loop-nothing-found-message {
	padding-left: 30px;
	padding-right: 30px;
}

.calendar-container{
	width: 111px !important;
	height: 111px !important;
}


/* ---------- Base: add to the image container ---------- */
.has-dots, .has-dots>div {
  position: relative;         /* anchor the overlay */
  isolation: isolate;
  z-index: 1;
  --dot-url: url('/wp-content/uploads/2025/09/dots.svg');
  /* defaults you can override per instance */
  --dot-size: clamp(72px, 10vw, 120px); /* responsive size */
  --edge: 0%;                            /* how far beyond edges to push */
  /* per-dot coordinates (x, y) and sizes */
  --dot1-x: 0%;  --dot1-y: 0%;
  --dot2-x: 0%;  --dot2-y: 0%;
  --dot3-x: 0%;  --dot3-y: 0%;
  --dot1-w: var(--dot-size); --dot1-h: var(--dot-size);
  --dot2-w: var(--dot-size); --dot2-h: var(--dot-size);
  --dot3-w: var(--dot-size); --dot3-h: var(--dot-size);
}

/* The painter: spans the container and draws 1–3 copies */
.has-dots::before {
  content: "";
  position: absolute;
  height: 120%;
  width: 112%;
  top: -10% !important;
  left: -6% !important;
  opacity: .7;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  background-repeat: no-repeat;
  /* always define up to 3 layers; extras are ignored if the image count is smaller */
  background-position:
    var(--dot1-x) var(--dot1-y),
    var(--dot2-x) var(--dot2-y),
    var(--dot3-x) var(--dot3-y);
  background-size:
    var(--dot1-w) var(--dot1-h),
    var(--dot2-w) var(--dot2-h),
    var(--dot3-w) var(--dot3-h);
}

/* Choose how many dots you want */
.has-dots.dots-1::before { background-image: var(--dot-url); }
.has-dots.dots-2::before { background-image: var(--dot-url), var(--dot-url); }
.has-dots.dots-3::before { background-image: var(--dot-url), var(--dot-url), var(--dot-url); }

/* ---------- Position utility classes (extend as needed) ---------- */
/* Left Center */
.dot1--lc { --dot1-x: calc(0% - var(--edge)); --dot1-y: 30%; }
.dot2--lc { --dot2-x: calc(0% - var(--edge)); --dot2-y: 30%; }
.dot3--lc { --dot3-x: calc(0% - var(--edge)); --dot3-y: 30%; }
/* Right Center */
.dot1--rc { --dot1-x: calc(100% + var(--edge)); --dot1-y: 30%; }
.dot2--rc { --dot2-x: calc(100% + var(--edge)); --dot2-y: 30%; }
.dot3--rc { --dot3-x: calc(100% + var(--edge)); --dot3-y: 30%; }
/* Top Right Corner */
.dot1--trc { --dot1-x: calc(100% + var(--edge)); --dot1-y: 0%; }
.dot2--trc { --dot2-x: calc(100% + var(--edge)); --dot2-y: 0%; }
.dot3--trc { --dot3-x: calc(100% + var(--edge)); --dot3-y: 0%; }
/* Top Right Corner Inner */
.dot1--trci { --dot1-x: 92%; --dot1-y: 12%; }
.dot2--trci { --dot2-x: 92%; --dot2-y: 12%; }
.dot3--trci { --dot2-x: 92%; --dot2-y: 12%; }
/* Lower Left */
.dot1--ll { --dot1-x: calc(0% - var(--edge)); --dot1-y: 80%; }
.dot2--ll { --dot2-x: calc(0% - var(--edge)); --dot2-y: 80%; }
.dot3--ll { --dot3-x: calc(0% - var(--edge)); --dot3-y: 80%; }
/* Lower Right */
.dot1--lr { --dot1-x: calc(100% + var(--edge)); --dot1-y: 80%; }
.dot2--lr { --dot2-x: calc(100% + var(--edge)); --dot2-y: 80%; }
.dot3--lr { --dot3-x: calc(100% + var(--edge)); --dot3-y: 80%; }
/* Bottom Left Corner */
.dot1--blc { --dot1-x: 0%; --dot1-y: calc(100% + var(--edge)); }
.dot2--blc { --dot2-x: 0%; --dot2-y: calc(100% + var(--edge)); }
.dot3--blc { --dot3-x: 0%; --dot3-y: calc(100% + var(--edge)); }
/* Top Left Corner */
.dot1--tlc { --dot1-x: 0%; --dot1-y: 0%; }
.dot2--tlc { --dot2-x: 0%; --dot2-y: 0%; }
.dot3--tlc { --dot3-x: 0%; --dot3-y: 0%; }
/* Bottom Left */
.dot1--bl { --dot1-x: 40%; --dot1-y: calc(100% + var(--edge)); }
.dot2--bl { --dot2-x: 40%; --dot2-y: calc(100% + var(--edge)); }
.dot3--bl { --dot3-x: 40%; --dot3-y: calc(100% + var(--edge)); }
/* Bottom Right */
.dot1--br { --dot1-x: 80%; --dot1-y: calc(100% + var(--edge)); }
.dot2--br { --dot2-x: 80%; --dot2-y: calc(100% + var(--edge)); }
.dot3--br { --dot3-x: 80%; --dot3-y: calc(100% + var(--edge)); }

/* ---------- Handy per-instance knobs ---------- */
.--size-100  { --dot-size: 100px; }    /* fixed size */
.--edge-12  { --edge: 12%; }         /* push further off the edge */

/* Responsive tweaks */
@media (max-width: 768px) {
  .has-dots {
	  --dot-size: clamp(62px, 14vw, 100px);
	}
  .has-dots::before {
	  height: 114%;
	  width: 108%;
	  top: -8% !important;
	  left: -4% !important;
  }
  .--edge-compact { --edge: -4%; }
}