/* default color: #fa6a2e  */
.bg-color,
header,
section.bg-color,
section.call-to-action,
a.btn-main,
.btn-main,
#mainmenu li li a.menu-item:hover,
#mainmenu ul li:hover>a.menu-item,
.price-row,
.slider-info .text1,
.btn-primary,
.bg-id-color,
.dropcap,
.fullwidthbanner-container a.btn,
.feature-box-big-icon i,
#testimonial-full,
.icon-deco i,
.feature-box-small-icon .border,
.date-post,
.team-list .small-border,
.de-team-list .small-border,
.owl-arrow span,
.de-progress .progress-bar,
#btn-close-x:hover,
.box-fx .info,
.btn-more,
.widget .small-border,
.product img:hover,
#btn-search,
.de_tab.timeline li.active .dot,
.btn-id,
.tiny-border,
#subheader .small-border-deco span,
#services-list li a:hover,
#form_subscribe #btn-subscribe i,
.timeline .tl-block .tl-line,
.de_tab.tab_style_2 .de_nav li.active span,
.de_tab.tab_methods.style-2 .de_nav li.active span,
.feature-box-small-icon.style-2 .number.bg-color,
.owl-custom-nav .btn-next:before,
.owl-custom-nav .btn-prev:before,
.timeline>li>.timeline-badge,
.de_light .de_tab.tab_style_3 .de_nav li.active span,
.de_tab.tab_style_4 .de_nav li.active span,
.circle,
.social-icons-sm i:hover,
.btn-rsvp,
.pricing-table .ribbon,
.de_tab.tab_style_4 .de_nav li.active,
#preloader .s1 span,
#filters a.selected,
.custom-show:after,
.custom-close:after,
.widget-post .date,
.style-2 .date-box,
.d-card i,
.accordion-section-title:before,
#form_subscribe #btn-submit i,
.bg-gradient-to-right-2,
.d-card.hover i,
.d-card:hover i,
.ribbon,
.box-icon-simple .num,
.feature-box.f-boxed:hover,
.fpw-overlay-btm,
.fp-wrap .fpwow-icons,
.owl-item.active.center .feature-box-type-2,
.testimonial-color .item:nth-child(1n) blockquote:before,
.spinner>div,
.d-gallery-item .dgi-1,
a.btn-border:hover,
.dih-overlay,
.widget_tags li a,
.nav-pills .nav-link.active,
.nav-pills .show>.nav-link,
#cookieConsent a.cookieConsentOK,
.mask .cover,
.icon-box:hover,
.feature-box.f-boxed.invert,
.text-light .container-timeline ul li::before,
.text-light .de_countdown,
.text-light .dropdown li span,
#selector #dark-mode,
#selector #related-items,
.dropdown li span:hover,
.de-event-item .d-date,
.switch,
h5 span.label,
.lds-roller div:after,
.de_pricing-table .d-list li:before,
.ul-style-4 li:before,
#mainmenu ul li b,
h1.s2 .c1 span,
.d-arrow-left,
.d-arrow-right,
.de-marquee-list .d-item-block,
.scrollbar,
.d_demo_img .d-overlay span
 {
    background:linear-gradient(to right, var(--primary-color), var(--secondary-color));
}

::-moz-selection { /* Code for Firefox */
    color:#ffffff;
    background:var(--secondary-color);
}

::selection {
    color:#ffffff;
    background:var(--secondary-color);
}

#back-to-top,
.btn-line:hover,
a.btn-line:hover,
.btn-main.bg-color,
.de-marquee-list .d-item-block.bg-color{
    background: var(--primary-color);
}

.id-color,
.date-box .day,
.slider_text h1,
h1.id-color,
h2.id-color,
h3.id-color,
h4.id-color,
.pricing-box li h1,
.title span,
i.large:hover,
.feature-box-small-icon-2 i,
.pricing-dark .pricing-box li.price-row,
.ratings i,
header.smaller #mainmenu a.menu-item.active,
.pricing-dark .pricing-box li.price-row,
.dark .feature-box-small-icon i,
a.btn-slider:after,
a.btn-line:after,
.team-list .social a,
.de_contact_info i,
.dark .btn-line:hover:after,
.dark a.btn-line:hover:after,
.dark a.btn-line.hover:after,
a.btn-text:after,
.separator span i,
address span strong,
.widget_tags li a,
.dark .btn-line:after,
.dark a.btn-line:after,
.crumb li .active,
.btn-right:after,
.btn-left:before,
#mainmenu li a.menu-item:after,
header .info .social i:hover,
#services-list li.active,
#services-list li.active a:after,
.testimonial-list:before,
span.deco-big,
h2.hs1 span,
.blog-list .date-box .day,
.social-icons-sm i,
.de_tab.tab_style_4 .de_nav li span,
.de_testi.opt-2 blockquote:before,
.profile_pic .subtitle,
.countdown-s3 .countdown-period,
.countdown-s4 .countdown-period,
.social-icons i:hover,
a.btn-link,
blockquote.s1:before,
.accordion a:before,
.expand-custom .toggle:before,
.sitemap.s1 li:before,
.list li:before,
.post-meta span:before,
.mask .cover .date:before,
.pricing-s2 .bottom i,
.post-text h3 a:hover,
.demo-icon-wrap i,
.demo-icon-wrap-s2 span,
a.btn-border.light:hover,
.de_testi.opt-2.review .p-rating,
.p-title,
.h-phone i,
a.btn-main.btn-white,
a.bc-btn,
.de_tab .de_nav li span,
.nav-link, .nav-link:focus, .nav-link:hover,
.pricing-table .bottom i,
#topbar i,
.topbar-widget a span,
.de-icon,
a#cookit-link,
#mainmenu>li.has-child:after {
    color: var(--primary-color);
}


a,
a:hover,
footer .widget a:hover,
.id-color-2,
.id-color-secondary,
span.id-color-2,
.icon-box i,
.h-phone i.id-color-secondary,
.mask:hover .cover h3 i,
address.s1 span i,
.de_table .tr .td:nth-child(2) span,
.activity-filter i,
.dark-scheme .demo-icon-wrap i,
.dark-scheme .demo-icon-wrap-s2 span,
.de_tab .de_nav li span,
.dark-scheme .small-border,
.profile_username,
.de_tab.tab_methods .de_nav li.active span img,
.ul-style-3 li:after,
.accordion-button:not(.collapsed),
.ul-style-2 li:before,
.pricing-table.table-featured .bottom i,
.schedule-item .sc-name,
.social-icons i
{
    color: var(--secondary-color);
}


.bg-color-2,
.bg-color-secondary,
section.bg-color-2,
section.bg-color-secondary,
.timeline h5,
.testimonial-color .item:nth-child(2n) blockquote:before,
a.btn-main.bg-color-2,
a.btn-main.invert,
#mainmenu li li a.menu-item:hover,
#mainmenu ul li:hover>a.menu-item,
.icon-box.invert:hover,
#jpreBar,
.t-circle,
.author_list_pp i,
.pagination>.active>a,
.pagination>.active>span,
.pagination>.active>a:hover,
.pagination>.active>span:hover,
.pagination>.active>a:focus,
.pagination>.active>span:focus,
.profile_avatar i,
#btn_copy.clicked,
#form_quick_search #btn-submit i,
.owl-dot.active,
.p_list_pp i,
.author_list_pp img,
.activity-filter li.active,
.dark-scheme .de_countdown.bg-color-secondary,
.btn-line.hover,
a.btn-line.hover,
.de_form input[type="checkbox"]:checked + label:before,
.coll_list_pp i,
#form_sb #btn-submit i,
.de-switch input[type=checkbox]:checked + label,
.de-card .de-price span,
.de-color-icons i,
.container-timeline ul li::before,
.pricing-table.table-featured .mid,
.pricing-table.table-featured a.btn-main,
.page-item.active .page-link,
.de-marquee-list .d-item-block.bg-color-2{
    background: var(--secondary-color);
}

.bg-color-3{
    background: var(--tertiary-color);
}

section.dark {
    background: rgba(var(--primary-color-rgb), .98);
}

.feature-box-group .d-card i,
.accordion-section-title.active,
.accordion.secondary .accordion-section-title:before
.d-card i {
    background: var(--secondary-color);
}

.bg-gradient-to-right,
.post-image .post-info .inner,
.de_table.table-style-2:not(.no-heading) .tr:first-child,
h1 .label,
a.btn-main.secondary,
header.header-gradient,
.ribbon.s2 {
    background: var(--primary-color);
}

.table-pricing thead,
.bg-gradient-to-top-right,
.p-tagline,
h5.title{
    background: linear-gradient(to right, var(--primary-color), var(--secondary-color));
}

.gradient-soft {
    background: -moz-linear-gradient(180deg, rgba(var(--primary-color-rgb), 0.125) 0%, rgba(var(--primary-color-rgb), 0) 100%);
    background: -webkit-linear-gradient(180deg, rgba(var(--primary-color-rgb), 0.125) 0%, rgba(var(--primary-color-rgb), 0) 100%);
    background: linear-gradient(180deg, rgba(var(--primary-color-rgb), 0.125) 0%, rgba(var(--primary-color-rgb), 0) 100%);
}

.gradient-soft-2 {
    background: -moz-linear-gradient(180deg, rgba(var(--primary-color-rgb), 0.2) 0%, rgba(var(--primary-color-rgb), 0) 100%);
    background: -webkit-linear-gradient(180deg, rgba(var(--primary-color-rgb), 0.2) 0%, rgba(var(--primary-color-rgb), 0) 100%);
    background: linear-gradient(180deg, rgba(var(--primary-color-rgb), 0.2) 0%, rgba(var(--primary-color-rgb), 0) 100%);
}

.gradient-soft-45 {
    background: -moz-linear-gradient(45deg, rgba(var(--secondary-color-rgb), .3) 0%, rgba(var(--primary-color-rgb), .3) 100%);
    background: -webkit-linear-gradient(45deg, rgba(var(--secondary-color-rgb), .3) 0%, rgba(var(--primary-color-rgb), .3) 100%);
    background: linear-gradient(45deg, rgba(var(--secondary-color-rgb), .3) 0%, rgba(var(--primary-color-rgb), .3) 100%);
}

.d-card i,.d-card:hover i{
    background: -moz-linear-gradient(180deg, rgba(var(--primary-color-rgb), 1) 20%, rgba(var(--primary-color-rgb), 0) 100%);
    background: -webkit-linear-gradient(180deg, rgba(var(--primary-color-rgb), 1) 20%, rgba(var(--primary-color-rgb), 0) 100%);
    background: linear-gradient(180deg, rgba(var(--primary-color-rgb), 1) 20%, rgba(var(--primary-color-rgb), 0) 100%);
}

#preloader {
    background-image: linear-gradient(to top right, var(--primary-color), var(--secondary-color));
}

.overlay-gradient {
    background: -moz-linear-gradient(45deg, rgba(var(--primary-color-rgb), 0.9) 0%, rgba(var(--primary-color-2-rgb), 0.9) 100%);
    background: -webkit-linear-gradient(45deg, rgba(var(--primary-color-rgb), 0.9) 0%, rgba(var(--primary-color-2-rgb), 0.9) 100%);
    background: linear-gradient(45deg, rgba(var(--primary-color-rgb), 0.9) 0%, rgba(var(--primary-color-2-rgb), 0.9) 100%);
}

.overlay-gradient.t80 {
    background: -moz-linear-gradient(45deg, rgba(var(--primary-color-rgb), 0.8) 0%, rgba(var(--primary-color-2-rgb), 0.8) 100%);
    background: -webkit-linear-gradient(45deg, rgba(var(--primary-color-rgb), 0.8) 0%, rgba(var(--primary-color-2-rgb), 0.8) 100%);
    background: linear-gradient(45deg, rgba(var(--primary-color-rgb), 0.8) 0%, rgba(var(--primary-color-2-rgb), 0.8) 100%);
}

.overlay-gradient.t70 {
    background: -moz-linear-gradient(45deg, rgba(var(--primary-color-rgb), 0.7) 0%, rgba(var(--primary-color-2-rgb), 0.7) 100%);
    background: -webkit-linear-gradient(45deg, rgba(var(--primary-color-rgb), 0.7) 0%, rgba(var(--primary-color-2-rgb), 0.7) 100%);
    background: linear-gradient(45deg, rgba(var(--primary-color-rgb), 0.7) 0%, rgba(var(--primary-color-2-rgb), 0.7) 100%);
}

.overlay-gradient.t60 {
    background: -moz-linear-gradient(45deg, rgba(var(--primary-color-rgb), 0.6) 0%, rgba(var(--primary-color-2-rgb), 0.6) 100%);
    background: -webkit-linear-gradient(45deg, rgba(var(--primary-color-rgb), 0.6) 0%, rgba(var(--primary-color-2-rgb), 0.6) 100%);
    background: linear-gradient(45deg, rgba(var(--primary-color-rgb), 0.6) 0%, rgba(var(--primary-color-2-rgb), 0.6) 100%);
}

.overlay-gradient.t50 {
    background: -moz-linear-gradient(45deg, rgba(var(--primary-color-rgb), 0.5) 0%, rgba(var(--primary-color-2-rgb), 0.5) 100%);
    background: -webkit-linear-gradient(45deg, rgba(var(--primary-color-rgb), 0.5) 0%, rgba(var(--primary-color-2-rgb), 0.5) 100%);
    background: linear-gradient(45deg, rgba(var(--primary-color-rgb), 0.5) 0%, rgba(var(--primary-color-2-rgb), 0.5) 100%);
}

.all-timelines::before {
    background: rgba(var(--secondary-color-rgb), .3);
}

.pricing-table .bottom i{
    background: rgba(var(--secondary-color-rgb), .2);
}

#topbar {
    background: rgba(var(--primary-color-rgb), .1);
}

.activity-list li:after{
    color: rgba(var(--secondary-color-rgb), 1);
}

.item_info_counts>div,
.de_table .tr .td:nth-child(2) span,
.activity-filter i,
.accordion-button:not(.collapsed) {
    background: rgba(var(--secondary-color-rgb), .1);
}

.activity-list li{
    background: rgba(var(--secondary-color-rgb), .07);
}

body::-webkit-scrollbar-thumb,#de_modal::-webkit-scrollbar-thumb
 {
    background:linear-gradient(0deg, var(--secondary-color), var(--primary-color));
}

a.btn-border.btn-invert,
.small-border,
.icon-box,
#slider-carousel .owl-thumb-item.active img {
    border-color: var(--primary-color);
}

.de_countdown,
.container-timeline ul li::before,
.de_tab.tab_methods .de_nav li.active span,
.dark-scheme .pagination li.active a{
    border-color: var(--secondary-color);
}

.author_list_pp:hover img{
    -webkit-box-shadow: 0px 0px 0px 2px rgba(var(--secondary-color-rgb), 1);
    -moz-box-shadow: 0px 0px 0px 2px rgba(var(--secondary-color-rgb), 1);
    box-shadow: 0px 0px 0px 2px rgba(var(--secondary-color-rgb), 1);
}

.form-border input[type=text]:focus,
.form-border textarea:focus,
.form-underline input[type=email]:focus,
.form-border input[type=date]:focus,
.form-border select:focus,
#quick_search:hover,
.items_filter .dropdown:hover{
    webkit-box-shadow: 0px 0px 0px 4px rgba(var(--primary-color-rgb), .3);
    -moz-box-shadow: 0px 0px 0px 4px rgba(var(--primary-color-rgb), .3);
    box-shadow: 0px 0px 0px 4px rgba(var(--primary-color-rgb), .3);
}

.container-timeline ul lifblockquote {
    border-left-color: var(--primary-color);
}

.de_tab.tab_simple .de_nav li.active span{
    border-bottom-color: var(--primary-color);
}

header #mainmenu a.menu-item span,
header.transparent #mainmenu a.menu-item span,
.de-grey #subheader h1 {
    border-bottom-color: var(--secondary-color);
}

.header-light #quick_search {
    background: rgba(var(--primary-color-rgb), .1);
}

.box-highlight{
    background: rgba(var(--primary-color-rgb), .2);
}

.container-timeline ul li {
    border-top-color: var(--secondary-color);
}

.line-preloader .p-line:nth-child(1) {
    border-right-color: var(--secondary-color);
    border-bottom-color: var(--secondary-color);
}

.line-preloader .p-line:nth-child(2) {
    border-left-color: var(--secondary-color);
    border-top-color: var(--secondary-color);
}

.line-preloader .p-line:nth-child(3) {
    border-right-color: var(--secondary-color);
    border-top-color: var(--secondary-color);
}

.de-event-item .d-shadow{
    border-color: transparent transparent transparent var(--secondary-color);;
}

.preloader1 {
    width: 60px;
    border-top-color: rgba(var(--primary-color-rgb), 0.65);
    border-bottom-color: rgba(var(--primary-color-rgb), 0.1);
    border-left-color: rgba(var(--primary-color-rgb), 0.1);
    border-right-color: rgba(var(--primary-color-rgb), 0.1);
}
.gradient,
.menu-col li a.active{
    background: -webkit-linear-gradient(45deg,var(--secondary-color) 0%, var(--primary-color) 100%);
    background: -moz-linear-gradient(45deg,var(--secondary-color) 0%, var(--primary-color) 100%);
    background: linear-gradient(45deg,var(--secondary-color) 0%, var(--primary-color) 100%);
}

.text-gradient{
    background: -webkit-linear-gradient(45deg,var(--primary-color) 0%, var(--secondary-color) 100%);
    background: -moz-linear-gradient(45deg,var(--primary-color) 0%, var(--secondary-color) 100%);
    background: linear-gradient(45deg,var(--primary-color) 0%, var(--secondary-color) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.gradient-soft{
background: -moz-linear-gradient(0deg, rgba(var(--primary-color-rgb), .45) 0%, rgba(var(--secondary-color-rgb), 0.25) 100%);
background: -webkit-linear-gradient(0deg, rgba(var(--primary-color-rgb), .45) 0%, rgba(var(--secondary-color-rgb), 0.25) 100%);
background: linear-gradient(0deg, rgba(var(--primary-color-rgb), .45) 0%, rgba(var(--secondary-color-rgb), 0.25) 100%);
}

.menu-col li a{
background: -moz-linear-gradient(45deg, rgba(var(--secondary-color-rgb), 0.2) 0%, rgba(var(--secondary-color-rgb), 0) 100%);
background: -webkit-linear-gradient(45deg, rgba(var(--secondary-color-rgb), 0.2) 0%, rgba(var(--secondary-color-rgb), 0) 100%);
background: linear-gradient(45deg, rgba(var(--secondary-color-rgb), 0.2) 0%, rgba(var(--secondary-color-rgb), 0) 100%);
}

footer.footer-light{
    background: -moz-linear-gradient(45deg, rgba(var(--secondary-color-rgb), .10) 0%, rgba(var(--primary-color-rgb), .10) 100%);
    background: -webkit-linear-gradient(45deg, rgba(var(--secondary-color-rgb), .10) 0%, rgba(var(--primary-color-rgb), .30) 100%);
    background: linear-gradient(45deg, rgba(var(--secondary-color-rgb), .30) 0%, rgba(var(--primary-color-rgb), .30) 100%);
}

.bg-gradient-to-bottom{
    background: -moz-linear-gradient(180deg, rgba(var(--primary-color-rgb), .35) 0%, rgba(var(--secondary-color-rgb), 0.25) 60%, rgba(var(--secondary-color-rgb), 0) 100%);
    background: -webkit-linear-gradient(180deg, rgba(var(--primary-color-rgb), .35) 0%, rgba(var(--secondary-color-rgb), 0.25) 60%, rgba(var(--secondary-color-rgb), 0) 100%);
    background: linear-gradient(180deg, rgba(var(--primary-color-rgb), .35) 0%, rgba(var(--secondary-color-rgb), 0.25) 60%, rgba(var(--secondary-color-rgb), 0) 100%);
}

@media only screen and (max-width: 992px) {
    .table-pricing tbody tr th {
        background: var(--primary-color);
    }

}

/* === Custom Footer Background === */
footer {
    background: url('../images/background/bg-grid.webp') no-repeat center center/cover;
    color: #fff;
    position: relative;
    z-index: 1;
}
footer::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(20, 20, 40, 0.85); /* dark overlay for readability */
    z-index: -1;
}

/* === Icon Styling === */
.fa, .fa-brands, .fa-solid, .fa-regular, .fa-light, .fa-duotone, .fa-fw, i[class^="icon_"] {
    color: #00e6e6;
    font-size: 1.25em;
    transition: color 0.2s;
    vertical-align: middle;
}
.fa:hover, .fa-brands:hover, .fa-solid:hover, .fa-regular:hover, .fa-light:hover, .fa-duotone:hover, .fa-fw:hover, i[class^="icon_"]:hover {
    color: #ffb400;
}

/* === Social Media Brand Colors with Backgrounds === */
.fa-facebook-f {
    color: #ffffff !important;
    background: #1877f2 !important;
    padding: 8px 12px !important;
    border-radius: 50% !important;
    transition: all 0.3s ease !important;
}
.fa-facebook-f:hover {
    background: #166fe5 !important;
    transform: scale(1.1) !important;
}

.fa-twitter {
    color: #ffffff !important;
    background: #1da1f2 !important;
    padding: 8px 12px !important;
    border-radius: 50% !important;
    transition: all 0.3s ease !important;
}
.fa-twitter:hover {
    background: #1a91da !important;
    transform: scale(1.1) !important;
}

.fa-discord {
    color: #ffffff !important;
    background: #5865f2 !important;
    padding: 8px 12px !important;
    border-radius: 50% !important;
    transition: all 0.3s ease !important;
}
.fa-discord:hover {
    background: #4752c4 !important;
    transform: scale(1.1) !important;
}

.fa-tiktok {
    color: #ffffff !important;
    background: #000000 !important;
    padding: 8px 12px !important;
    border-radius: 50% !important;
    transition: all 0.3s ease !important;
}
.fa-tiktok:hover {
    background: #ff0050 !important;
    transform: scale(1.1) !important;
}

.fa-youtube {
    color: #ffffff !important;
    background: #ff0000 !important;
    padding: 8px 12px !important;
    border-radius: 50% !important;
    transition: all 0.3s ease !important;
}
.fa-youtube:hover {
    background: #cc0000 !important;
    transform: scale(1.1) !important;
}

.fa-instagram {
    color: #ffffff !important;
    background: linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%) !important;
    padding: 8px 12px !important;
    border-radius: 50% !important;
    transition: all 0.3s ease !important;
    display: inline-block !important;
    text-align: center !important;
    min-width: 40px !important;
    height: 40px !important;
    line-height: 24px !important;
}

.fa-instagram:hover {
    background: linear-gradient(45deg, #e6683c 0%, #dc2743 25%, #cc2366 50%, #bc1888 75%, #f09433 100%) !important;
    transform: scale(1.1) !important;
    box-shadow: 0 4px 15px rgba(220, 39, 67, 0.4) !important;
}

.fa-linkedin {
    color: #ffffff !important;
    background: #0077b5 !important;
    padding: 8px 12px !important;
    border-radius: 50% !important;
    transition: all 0.3s ease !important;
}
.fa-linkedin:hover {
    background: #005885 !important;
    transform: scale(1.1) !important;
}

.fa-google {
    color: #ffffff !important;
    background: #4285f4 !important;
    padding: 8px 12px !important;
    border-radius: 50% !important;
    transition: all 0.3s ease !important;
}
.fa-google:hover {
    background: #3367d6 !important;
    transform: scale(1.1) !important;
}

.fa-apple {
    color: #ffffff !important;
    background: #000000 !important;
    padding: 8px 12px !important;
    border-radius: 50% !important;
    transition: all 0.3s ease !important;
}
.fa-apple:hover {
    background: #333333 !important;
    transform: scale(1.1) !important;
}

.fa-steam {
    color: #ffffff !important;
    background: #171a21 !important;
    padding: 8px 12px !important;
    border-radius: 50% !important;
    transition: all 0.3s ease !important;
}
.fa-steam:hover {
    background: #2a475e !important;
    transform: scale(1.1) !important;
}

.fa-reddit {
    color: #ffffff !important;
    background: #ff4500 !important;
    padding: 8px 12px !important;
    border-radius: 50% !important;
    transition: all 0.3s ease !important;
}
.fa-reddit:hover {
    background: #cc3700 !important;
    transform: scale(1.1) !important;
}

.fa-twitch {
    color: #ffffff !important;
    background: #9146ff !important;
    padding: 8px 12px !important;
    border-radius: 50% !important;
    transition: all 0.3s ease !important;
}
.fa-twitch:hover {
    background: #7c3aed !important;
    transform: scale(1.1) !important;
}

.fa-snapchat {
    color: #000000 !important;
    background: #fffc00 !important;
    padding: 8px 12px !important;
    border-radius: 50% !important;
    transition: all 0.3s ease !important;
}
.fa-snapchat:hover {
    background: #e6e300 !important;
    transform: scale(1.1) !important;
}

.fa-pinterest {
    color: #ffffff !important;
    background: #bd081c !important;
    padding: 8px 12px !important;
    border-radius: 50% !important;
    transition: all 0.3s ease !important;
}
.fa-pinterest:hover {
    background: #a30718 !important;
    transform: scale(1.1) !important;
}

.fa-whatsapp {
    color: #ffffff !important;
    background: #25d366 !important;
    padding: 8px 12px !important;
    border-radius: 50% !important;
    transition: all 0.3s ease !important;
}
.fa-whatsapp:hover {
    background: #128c7e !important;
    transform: scale(1.1) !important;
}

.fa-telegram {
    color: #ffffff !important;
    background: #0088cc !important;
    padding: 8px 12px !important;
    border-radius: 50% !important;
    transition: all 0.3s ease !important;
}
.fa-telegram:hover {
    background: #006699 !important;
    transform: scale(1.1) !important;
}

.fa-spotify {
    color: #ffffff !important;
    background: #1db954 !important;
    padding: 8px 12px !important;
    border-radius: 50% !important;
    transition: all 0.3s ease !important;
}
.fa-spotify:hover {
    background: #1ed760 !important;
    transform: scale(1.1) !important;
}

.fa-soundcloud {
    color: #ffffff !important;
    background: #ff7700 !important;
    padding: 8px 12px !important;
    border-radius: 50% !important;
    transition: all 0.3s ease !important;
}
.fa-soundcloud:hover {
    background: #ff5500 !important;
    transform: scale(1.1) !important;
}

.fa-github {
    color: #ffffff !important;
    background: #333333 !important;
    padding: 8px 12px !important;
    border-radius: 50% !important;
    transition: all 0.3s ease !important;
}
.fa-github:hover {
    background: #000000 !important;
    transform: scale(1.1) !important;
}

.fa-stack-overflow {
    color: #ffffff !important;
    background: #f48024 !important;
    padding: 8px 12px !important;
    border-radius: 50% !important;
    transition: all 0.3s ease !important;
}
.fa-stack-overflow:hover {
    background: #e2761e !important;
    transform: scale(1.1) !important;
}

.fa-wordpress {
    color: #ffffff !important;
    background: #21759b !important;
    padding: 8px 12px !important;
    border-radius: 50% !important;
    transition: all 0.3s ease !important;
}
.fa-wordpress:hover {
    background: #1a5f7a !important;
    transform: scale(1.1) !important;
}

.fa-drupal {
    color: #ffffff !important;
    background: #0678be !important;
    padding: 8px 12px !important;
    border-radius: 50% !important;
    transition: all 0.3s ease !important;
}
.fa-drupal:hover {
    background: #055a8c !important;
    transform: scale(1.1) !important;
}

.fa-magento {
    color: #ffffff !important;
    background: #f46f25 !important;
    padding: 8px 12px !important;
    border-radius: 50% !important;
    transition: all 0.3s ease !important;
}
.fa-magento:hover {
    background: #e55a1b !important;
    transform: scale(1.1) !important;
}

.fa-opencart {
    color: #ffffff !important;
    background: #34a853 !important;
    padding: 8px 12px !important;
    border-radius: 50% !important;
    transition: all 0.3s ease !important;
}
.fa-opencart:hover {
    background: #2d8f47 !important;
    transform: scale(1.1) !important;
}

.fa-paypal {
    color: #ffffff !important;
    background: #003087 !important;
    padding: 8px 12px !important;
    border-radius: 50% !important;
    transition: all 0.3s ease !important;
}
.fa-paypal:hover {
    background: #002c6e !important;
    transform: scale(1.1) !important;
}

.fa-stripe {
    color: #ffffff !important;
    background: #6772e5 !important;
    padding: 8px 12px !important;
    border-radius: 50% !important;
    transition: all 0.3s ease !important;
}
.fa-stripe:hover {
    background: #5469d4 !important;
    transform: scale(1.1) !important;
}

.fa-bitcoin {
    color: #ffffff !important;
    background: #f7931a !important;
    padding: 8px 12px !important;
    border-radius: 50% !important;
    transition: all 0.3s ease !important;
}
.fa-bitcoin:hover {
    background: #e68a17 !important;
    transform: scale(1.1) !important;
}

.fa-ethereum {
    color: #ffffff !important;
    background: #627eea !important;
    padding: 8px 12px !important;
    border-radius: 50% !important;
    transition: all 0.3s ease !important;
}
.fa-ethereum:hover {
    background: #4f6cdb !important;
    transform: scale(1.1) !important;
}

/* === Gaming Platform Colors with Backgrounds === */
.fa-playstation {
    color: #ffffff !important;
    background: #003791 !important;
    padding: 8px 12px !important;
    border-radius: 50% !important;
    transition: all 0.3s ease !important;
}
.fa-playstation:hover {
    background: #002a6e !important;
    transform: scale(1.1) !important;
}

.fa-xbox {
    color: #ffffff !important;
    background: #107c10 !important;
    padding: 8px 12px !important;
    border-radius: 50% !important;
    transition: all 0.3s ease !important;
}
.fa-xbox:hover {
    background: #0d5f0d !important;
    transform: scale(1.1) !important;
}

.fa-nintendo-switch {
    color: #ffffff !important;
    background: #e60012 !important;
    padding: 8px 12px !important;
    border-radius: 50% !important;
    transition: all 0.3s ease !important;
}
.fa-nintendo-switch:hover {
    background: #cc0010 !important;
    transform: scale(1.1) !important;
}

/* === Other Brand Colors with Backgrounds === */
.fa-amazon {
    color: #ffffff !important;
    background: #ff9900 !important;
    padding: 8px 12px !important;
    border-radius: 50% !important;
    transition: all 0.3s ease !important;
}
.fa-amazon:hover {
    background: #e68a00 !important;
    transform: scale(1.1) !important;
}

.fa-ebay {
    color: #ffffff !important;
    background: #86b817 !important;
    padding: 8px 12px !important;
    border-radius: 50% !important;
    transition: all 0.3s ease !important;
}
.fa-ebay:hover {
    background: #6b9412 !important;
    transform: scale(1.1) !important;
}

.fa-shopify {
    color: #ffffff !important;
    background: #95bf47 !important;
    padding: 8px 12px !important;
    border-radius: 50% !important;
    transition: all 0.3s ease !important;
}
.fa-shopify:hover {
    background: #7a9a3a !important;
    transform: scale(1.1) !important;
}

.fa-woocommerce {
    color: #ffffff !important;
    background: #96588a !important;
    padding: 8px 12px !important;
    border-radius: 50% !important;
    transition: all 0.3s ease !important;
}
.fa-woocommerce:hover {
    background: #7a4670 !important;
    transform: scale(1.1) !important;
}

/* === Button Styling === */
.btn-main, .btn-lg, .btn-line, .btn-fullwidth, button, input[type="submit"], .btn {
    background: linear-gradient(90deg, #00e6e6 0%, #0077ff 100%);
    color: #fff !important;
    border: none;
    border-radius: 30px;
    padding: 0.75em 2em;
    font-weight: 600;
    box-shadow: 0 4px 16px rgba(0,0,0,0.08);
    transition: background 0.3s, color 0.3s, box-shadow 0.3s;
    cursor: pointer;
    outline: none;
}
.btn-main.btn-line {
    background: transparent;
    color: #00e6e6 !important;
    border: 2px solid #00e6e6;
}
.btn-main.btn-line:hover {
    background: #00e6e6;
    color: #fff !important;
}
.btn-main:hover, .btn-lg:hover, .btn-line:hover, .btn-fullwidth:hover, button:hover, input[type="submit"]:hover, .btn:hover {
    background: linear-gradient(90deg, #ffb400 0%, #ff0080 100%);
    color: #fff !important;
    box-shadow: 0 6px 24px rgba(0,0,0,0.12);
}
.btn-fullwidth {
    width: 100%;
    display: block;
    margin-top: 0.5em;
}

/* === Convert Behance to Instagram === */
.fa-behance, .fa-behance-square {
    color: #ffffff !important;
    background: linear-gradient(45deg, #f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%) !important;
    padding: 8px 12px !important;
    border-radius: 50% !important;
    transition: all 0.3s ease !important;
}
.fa-behance:hover, .fa-behance-square:hover {
    background: linear-gradient(45deg, #e6683c 0%,#dc2743 25%,#cc2366 50%,#bc1888 75%,#f09433 100%) !important;
    transform: scale(1.1) !important;
}