@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,100..900;1,9..144,100..900&display=swap');
@import url('https://fonts.googleapis.com/css?family=Poppins:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i');


/*
input {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
}
*/


a:focus {     outline: none; }
button:focus {     outline: none; }
:focus, :active {    outline: 0;    border: 0;}



select {
   appearance: none;       /* Remove default arrow */
   background-image: url(../images/small-down-arrow.png);
   background-repeat: no-repeat;
   background-position: 85% center;
}


@font-face {
font-family: 'Mileast';
font-style: normal;
font-weight: normal;
src: local('Mileast'), url('Mileast.woff') format('woff');
}



body {color: #fff; margin: 0px; font-family: poppins; font-size: 15px; font-weight: 300; line-height: 26px; margin: 0px 0px 0px 0px; background-image:url(../images/bg.jpg); background-position:center center; background-size:cover; background-attachment:fixed; }

html {  scroll-behavior: smooth;}


a{transition: all 0.5s ease-in 0s; text-decoration:none!important; outline:none; color: #000;}

a:focus, a:active,  a, focus, select {border:0px; outline:none;}

.clear{clear:both;}

p{margin-top:0px; text-align: left;}

img {border:0px;}

form{margin:0px;}

input {outline:none;}

* {box-sizing:border-box; }

.text-center {text-align:center;}


.map {width:100%; height:400px; border:0px; margin-top:30px;}



header {position:fixed; z-index:2; background-color:#222; display:table; width:100%;}

.getinsane { position:fixed; z-index:2; height:1px; text-align:center; width:100%; }

.getinsane img {display:block; width:300px; margin:auto; transition: all 0.5s ease-in 0s;}

.top-navigation a {display:inline-block; color:#fff; padding:25px 0px; font-weight:500;   width:12.5%; float:left; font-size:14px; line-height:130%; text-align:center; transition: all 0.5s ease-in 0s; background-image:url(../images/pipe2.png); background-repeat:no-repeat; background-position:left center;}

.top-navigation a:hover {color:#fe1839;}

.logo-gap {display:inline-block; width:310px; border:0px solid red; padding:20px; float:left; }

.r-menu {text-align:right; background-image:url(../images/pipe2.png); background-repeat:no-repeat; background-position:right center!important;}

.c-menu {text-align:center; padding-left:30px!important; background-image:url(../images/pipe2.png); background-repeat:no-repeat; background-position:right center!important;}

.header-gap {display:table; width:100%; height:75px;}


header.darker .top-navigation a {padding:15px 0px; transition: all 0.5s ease-in 0s;}

header.darker  .getinsane img {display:block; width:200px; margin:auto; transition: all 0.5s ease-in 0s;}



.hero-area {display:table; width:100%; padding-top:30px;}

.guarav-gupta {display:block; margin:auto;}

.guarav-gupta2 {display:none; margin:auto;}

.piercer-name {display:block; text-transform:uppercase; font-size:30px; color:#fff; font-weight:200; position:absolute; margin-top:-130px; margin-left:250px; width: 200px;}

.piercer-name strong {font-weight:800;}

.piercer-name em {font-size:16px; letter-spacing:2px; font-weight:600; font-style:normal;}

.piercer-name img {float:left;}

.center-logo  {display:block; margin:auto; margin-top:0px;}

#part-2 {padding-top:150px;}

#part-2 p {  text-align: left;  color: #fff;  font-weight: 500;  padding: 80px 60px 20px 60px; font-size: 16px;}

#banner-content {  padding-left: 0px;  width: 30%;}

#banner-content h1 {  font-size: 33px;  line-height: 28px;  font-weight: 100;  text-transform: uppercase;  color: #fff;  margin-top: 100px;}

#banner-content h1 strong {font-weight:800;}


.red {color:#fe1839;}

.white {color:#fff;}

.gray-area {background-color:#fe1839; padding:40px; display:table; clear:both; width:100%; }

.gray-area a {color:#fff; border-bottom:1px solid #fff; font-weight:500;}

.gray-area p {text-align:justify!important;}

.gray-area h3 {text-align:center; margin-top:0px;}

.gray-area ul {margin:0px 0px 0px 20px; padding:0px;}

.gray-area li {padding-left:10px;}



.red-area {background-color:#fe1839; padding:40px; display:table; clear:both; width:100%; }

.red-area a {color:#fff; border-bottom:1px solid #fff; font-weight:500;}

.red-area p {text-align:justify!important;}

.red-area h3 {text-align:center; margin-top:0px;}

.red-area ul {margin:0px 0px 0px 20px; padding:0px;}

.red-area li {padding-left:10px;}



.red-area2 {background-color:#fe1839; padding:40px; display:table; clear:both; width:100%; background-image:url(../images/bg2.png); }

.dotted-bg {background-color:#fe1839; padding:40px; display:table; clear:both; width:100%; background-image:url(../images/bg3.png); }

.dotted-bg a {color:#fff; border-bottom:1px solid #fff; }

.dotted-bg h2 {background-color:#fe1839; display:block; padding:10px;}


.half-left {width:49%; float:left;}

.half-right {width:49%; float:right;}


.half-left h3, .half-right h3 {text-align:center; font-size:18px; font-weight:700;  margin:20px 0px 10px 0px; background-color:#fe1839; border:2px solid #fff; color:#fff; padding:10px;  }

.center-text {text-align:center;}




.features {display:table; width:100%; }


#features-heading  { text-align:center; background-image:url(../images/heading-line.png); display:table; width:100%; margin-top:50px; }

#features-heading span {display:block; margin:auto; width:372px;}

#features-heading span strong { display:inline-block; background-color:#fe1839; text-transform:uppercase; letter-spacing:2px; font-weight:600;  margin:auto; width:300px; float:left; line-height:50px;}

.left-corner {float:left; display:inline-block;}

.right-corner {float:right; display:inline-block;}

.icon-box img {display:block; margin:auto; width:400px;}

#mobile-iconbox {display:none;}

.icon-box {width:20%; float:left; display:inline-block; text-align:center; background-image:url(../images/pipe.png); background-position:right center; background-repeat:no-repeat; }

.icon-box:last-child {background-image:none;}

.icon-box img {display:block; margin:30px auto 10px auto; padding:15px; width:100px; transition: all 0.5s ease-in 0s;}

.icon-box:hover img {padding:0px; transition: all 0.5s ease-in 0s;}

.icon-box:hover span {color:#fe1839; transition: all 0.5s ease-in 0s;}

.icon-box span {display:block; font-weight:800; line-height:120%; transition: all 0.5s ease-in 0s;}

#icon-holder {width:900px; margin:auto;}


.copyright {text-align:center; padding:20px 0px; font-size:11px; line-height:20px; letter-spacing:1px; text-transform:uppercase;  margin-top:0px; color:#999; background-color:#111; border-top:1px solid #333;}

.copyright a {color:#999; border-bottom:1px solid #999; display:inline-block; margin:0px 5px;}

footer {background-color:#111; display:table; width:100%; padding:30px 0px; margin-top:0px; color:#ccc; font-size:13px;}

footer h4 {font-size:16px; font-weight:500; text-transform:uppercase; letter-spacing:2px; color:#fff;}

footer h4:after {content:''; display:block; width:30px; height:2px; background-color:#fe1839; margin:15px 0px; }

footer strong {font-weight:600; color:#fff;}

footer a {color:#ccc;}

footer a:hover {padding-left:10px; color:#fff;}

footer a img {float:left; width:20px; margin-right:5px; margin-top:4px; opacity:0.5;}



#privacy-policy { background-color:rgb(0,0,0,0.5); padding:40px; border:1px solid #333; max-width:1240px; margin:auto;}

#privacy-policy h1 {margin-top:0px;}

#privacy-policy h2, #privacy-policy  h3 { text-align:left; font-size:24px;}

#privacy-policy  h3 { text-align:left; font-size:18px;}

#privacy-policy p { text-align:left;}

#privacy-policy  ul {padding:0px; margin:20px 0px 20px 20px; }

#privacy-policy ul li { padding-left:10px; list-style-image:url(../images/bullet2.png);}





.inside-content-area {display:table; width:100%; padding:50px 0px 0px 0px;} 

.inside-content-area h1 {font-family: 'Mileast';  font-size:48px; line-height:120%; text-align:center; color:#fff; font-weight:800;}

.inside-content-area h2 { font-size:32px; text-align:center; color:#fff; font-weight:600; line-height:140%;}

.inside-content-area h3 { font-size:26px; text-align:center; color:#fff; font-weight:600; line-height:140%;}


.inside-content-area p {text-align:center;}

.work-box {display:table;; padding:20px; background-color:#222;  width:100%; float:left;  margin:10px 0px;} 

.work-box h3 {margin-top:0px;}

.work-box h3 a {color:#fff; border-bottom:0px solid #fff;}

.work-box a, .work-box p a {color:#fe1839; border-bottom:1px solid #fe1839; font-weight:500;}

.work-box p {text-align:left;}

.showcase {display:inline-block; float:left; margin-right:20px; border:10px solid #fe1839!important; width:100%;}

.showcase img {display:block; width:100%;}

.work-box ul {margin:0px 0px 20px 20px;  padding:0px; display:block; display:inline-block; }

.work-box li {padding-left:10px; list-style-image:url(../images/bullet.png)}

.work-left {width:30%; float:left; display:table; padding-right:20px;}

.work-right {width:70%; float:left; display:table;}

.work-right h3 {text-align:left;}


.thumbnails {display:table; width:100%; padding-bottom:20px;}

.thumbnails .showcase {display:inline-block; float:left; margin:.5%; border:10px solid #fe1839!important; width:19%;}

.justify {text-align:justify!important; margin:15px 0px!important;}


.blur {filter: blur(15px); display:block;}

.sensitive {display:block; text-align:center; font-weight:500; padding-top:10px; clear:both; }

.unblur {display:block; text-align:center; width:140px; margin:auto;}


.talk {display:table; width:100%; padding:15px; background-color:#fff; margin-bottom:20px; height:200px; color:#000; border-top:5px solid #000;}

.talk:after { width: 0;   height: 0;   border-left: 10px solid transparent;  border-right: 10px solid transparent;  border-top: 10px solid #fff; display:block; content:''; position:absolute; margin-top:200px; position:absolute; display:block; left:20px; top:0px;}
  



.dark-grey-box { display:table; width:100%; background-color:#222; padding:40px; margin-top:30px;}

.dark-grey-box a {color:#fff; border-bottom:1px solid #fff;}

.dark-grey-box h2 {text-align:center; font-size: 32px}

.dark-grey-box h3 {text-align:center; font-size: 28px}

.gallery h3 {text-align:center; font-size: 28px}


.dark-box {background-color:rgb(0,0,0,0.5); display:table; width:100%; padding:30px; border:1px solid #222; margin-bottom:30px;}

.dark-box h3 {text-align:left; margin-top:0px; margin-bottom:10px; color:#fe1839;}

.dark-box p {text-align:justify;}



.white-box { display:table; width:100%; background-color:#fff;  padding:20px;}

.white-box iframe {width:100%; height:600px; border:0px; }

.review-box {width:31.33%; float:left; margin:1%; position:relative;}




.dark-box-half-left {background-color:rgb(0,0,0,0.5); display:table; width:49%; margin-right:1%; padding:30px; border:1px solid #222; margin-bottom:30px; float:left; min-height:200px;}

.dark-box-half-right {background-color:rgb(0,0,0,0.5); display:table; width:49%; margin-left:1%; padding:30px; border:1px solid #222; margin-bottom:30px; float:left; min-height:200px;}

.dark-box-half-left h3, .dark-box-half-right h3 {text-align:left; margin-top:0px; margin-bottom:10px; color:#fe1839; font-size:20px;}

.dark-box-half-left ul, .dark-box-half-right ul {padding:0px; margin:20px 0px 20px 20px;}

.dark-box-half-left li, .dark-box-half-right li {padding-left:10px; list-style-image:url(../images/bullet2.png);}

.dark-box-half-left p, .dark-box-half-right p { text-align:left;}





.red-box {display:table; width:100%; padding:30px;  background-color:#fe1839; color:#fff; margin-bottom:30px;}

.red-box h3 {font-size:250%;}

.red-box p{font-weight:500;}


.red-box h3 {text-align:center;}



.data-table {width:100%; border-collapse:collapse; margin-bottom:30px; }

.data-table th {padding:10px; vertical-align:top; font-size:14px; border:1px solid #444; text-align:left; background-color:#fe1839;}

.data-table td {padding:10px; vertical-align:top; font-size:14px; border:1px solid #444;}




.listing {padding:0px; margin:20px 0px 20px 20px; }

.listing li {padding-left:10px; list-style-image:url(../images/bullet2.png);}


.listing3 {padding:0px; margin:20px 0px 20px 20px; }

.listing3 li {padding-left:10px; list-style-image:url(../images/bullet2.png); width:33%; float:left;}


b {font-weight:600;}










#sticky-cta {
  position: fixed;
  left: 0px;
  bottom: 0px;
  z-index: 9999;
  display: table;
  flex-direction: column;
  gap: 10px;
  width:calc(100% - 65px);
  padding:10px;
}

#sticky-cta .cta-btn {
  display: inline-block;
  padding: 10px 14px 10px 50px;
  border-radius: 5px;
  font-size: 14px;
  font-weight: bold;
  color: #fff;
  text-decoration: none;
  box-shadow: 0 4px 10px rgba(0,0,0,0.3);
  transition: transform 0.25s ease, opacity 0.25s ease;
  width:150px;
}

#sticky-cta .cta-btn.call {
  background: #fe1839; /* dark call button */
  float:left;
  background-image:url(../images/call-icon.png);
  background-repeat:no-repeat;
  background-size:30px auto;
  background-position:10px;
}

#sticky-cta .cta-btn.whatsapp {
  background: #25D366; /* WhatsApp green */
  background-image:url(../images/whatsapp-icon.png);
  background-repeat:no-repeat;
  background-size:30px auto;
  background-position:10px;
  width:150px;
  float:right;

}

#sticky-cta .cta-btn:hover {
  transform: scale(1.08);
  opacity: 0.9;
}


.call-to-action {background-color:#333; display:table; width:100%; padding:40px; text-align:center;}

.call-to-action h2 {margin:0px 0px 20px 0px;}

.call-to-action .call-button { display: inline-block;  width:180px;  padding: 10px 14px 10px 50px;  border-radius: 5px;  font-size: 14px;  font-weight: bold;  color: #fff;  text-decoration: none;  box-shadow: 0 4px 10px rgba(0,0,0,0.3);  transition: transform 0.25s ease, opacity 0.25s ease;  
background-image: url(../images/call-icon.png);  background-repeat: no-repeat;  background-size: 30px auto;  background-position: 10px; background-color: #fe1839;}

.call-to-action .whatsapp-button {display: inline-block;   width:180px; padding: 10px 14px 10px 50px;  border-radius: 5px;  font-size: 14px;  font-weight: bold;  color: #fff;  text-decoration: none;  box-shadow: 0 4px 10px rgba(0,0,0,0.3);  transition: transform 0.25s ease, opacity 0.25s ease;  
background-image: url(../images/whatsapp-icon.png);  background-repeat: no-repeat;  background-size: 30px auto;  background-position: 10px; background-color: #25D366;}


.testimonail-box {background-color: #222; padding:20px; width:100%;  text-align:justify!important;  margin-bottom:20px;  }

.testimonail-box strong {display:block; font-weight:600; margin-top:10px;}

.red-link {border-bottom:1px solid #fe1839; color:#fe1839; font-weight:600;}




.moko-aftercare {background-color: #222; padding:3%; width:100%;  text-align:justify!important;  margin-bottom:20px;  }

.moko-aftercare h3 {text-align:left; margin:20px 0px 0px 0px; font-size:20px;}

.moko-aftercare p {text-align:left;}

.moko-aftercare ul, .moko-aftercare ol {margin:0px 0px 0px 20px; padding:0px;}
 
.moko-aftercare li {padding-left:10px;}
 
.moko-aftercare a {color:#fff; border-bottom:1px solid #fff; font-weight:600;} 
 
 
 
 
 
 
 


/* Grid */


.grid-1280 {display:table; width:1280px; margin:auto;  }

.row {width: 100%; display: table; }

.col-1-of-12 {width: 8.33%; float: left; padding-left: 15px; padding-right: 15px; }

.col-1-of-11 {width: 9.09%; float: left; padding-left: 15px; padding-right: 15px; }

.col-1-of-10 {width: 10%; float: left; padding-left: 15px; padding-right: 15px; }

.col-1-of-9 {width: 11.11%; float: left; padding-left: 15px; padding-right: 15px; }

.col-8-of-9 {width: 88.89%; float: left; padding-left: 15px; padding-right: 15px; }

.col-7-of-9 {width: 77.78%; float: left; padding-left: 15px; padding-right: 15px; }

.col-6-of-9 {width: 66.67%; float: left; padding-left: 15px; padding-right: 15px; }

.col-5-of-9 {width: 55.56%; float: left; padding-left: 15px; padding-right: 15px; }

.col-4-of-9 {width: 44.45%; float: left; padding-left: 15px; padding-right: 15px; }

.col-3-of-9 {width: 33.34%; float: left; padding-left: 15px; padding-right: 15px; }

.col-2-of-9 {width: 22.23%; float: left; padding-left: 15px; padding-right: 15px; }


.col-1-of-8 {width: 12.50%; float: left; padding-left: 15px; padding-right: 15px; }

.col-7-of-8 {width: 87.50%; float: left; padding-left: 15px; padding-right: 15px; }

.col-6-of-8 {width: 75%; float: left; padding-left: 15px; padding-right: 15px; }

.col-5-of-8 {width: 62.50%; float: left; padding-left: 15px; padding-right: 15px; }

.col-4-of-8 {width: 50%; float: left; padding-left: 15px; padding-right: 15px; }

.col-3-of-8 {width: 37.50%; float: left; padding-left: 15px; padding-right: 15px; }

.col-2-of-8 {width: 25%; float: left; padding-left: 15px; padding-right: 15px; }

.col-1-of-7 {width: 14.28%; float: left; padding-left: 15px; padding-right: 15px; }

.col-6-of-7 {width: 85.68%; float: left; padding-left: 15px; padding-right: 15px; }

.col-5-of-7 {width: 71.4%; float: left; padding-left: 15px; padding-right: 15px; }

.col-4-of-7 {width: 57.12%; float: left; padding-left: 15px; padding-right: 15px; }

.col-3-of-7 {width: 42.84%; float: left; padding-left: 15px; padding-right: 15px; }

.col-2-of-7 {width: 28.56%; float: left; padding-left: 15px; padding-right: 15px; }

.col-1-of-6 {width: 16.66%; float: left; padding-left: 15px; padding-right: 15px; }

.col-5-of-6 {width: 83.33%; float: left; padding-left: 15px; padding-right: 15px; }

.col-4-of-6 {width: 66.64%; float: left; padding-left: 15px; padding-right: 15px; }

.col-3-of-6 {width: 49.98%; float: left; padding-left: 15px; padding-right: 15px; }

.col-2-of-6 {width: 33.32%; float: left; padding-left: 15px; padding-right: 15px; }

.col-1-of-5 {width: 20%; float: left; padding-left: 15px; padding-right: 15px; }

.col-4-of-5 {width: 80%; float: left; padding-left: 15px; padding-right: 15px; }

.col-3-of-5 {width: 60%; float: left; padding-left: 15px; padding-right: 15px; }

.col-2-of-5 {width: 40%; float: left; padding-left: 15px; padding-right: 15px; }

.col-1-of-4 {width: 25%; float: left; padding-left: 15px; padding-right: 15px; }

.col-3-of-4 {width: 75%; float: left; padding-left: 15px; padding-right: 15px; }

.col-1-of-3 {width: 33.33%; float: left; padding-left: 15px; padding-right: 15px; }

.col-2-of-3 {width: 66.66%; float: left; padding-left: 15px; padding-right: 15px; }

.col-1-of-2 {width: 50%; float: left; padding-left: 15px; padding-right: 15px; }

.col-1-of-1 {width: 100%;  padding-left: 15px; padding-right: 15px; }


.content {display: block; padding: 10px 0px; background-color: #eee; text-align: center; font-size: 10px; color: #000; border: 1px solid #ccc;}


/* Grid */




















/* Scroll Top */

.scrolltop {
	display:none;
	width:100%;
	margin:0 auto;
	position:fixed;
	bottom:0px;
	right:0px;	
	z-index:99;
}
.scroll {
	position:absolute;
	right:20px;
	bottom:10px;
	padding:0;
	text-align: center;
	margin: 0 0 0 0;
	cursor:pointer;
	transition: 0.5s;
	background-color: #fe1839;
	border-radius:5px;
}

.scroll a {padding:25px 0px 0px 0px; display:block; color:#fff; height:45px; width:45px; }

.scroll a span {
  width: 0; 
  height: 0; 
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-bottom: 10px solid #fff;
  display: block;
  margin:auto;
  animation: buttonarrow 0.6s infinite alternate ease-in-out;
}


@keyframes buttonarrow {
	0% {
		transform: translateY(0);
		opacity: 1.0
	}
	100% {
		transform: translateY(-0.5em);
		opacity: 1.0
	}
}

/* Scroll Top */









/* responsive menu */

.responsive-menu-icon { display:none;}


.responsive-menu-icon {
    display: block;
    cursor: pointer;
    background-color:#000;
    width: 63px;
    height: 63px;
    position: fixed;
    right: 0;
    top: 0px;
    padding: 21px;
    box-sizing: border-box;
    z-index: 10000;
    display: none;
    z-index: 1000;
}

.bar1, .bar2, .bar3 {
    width: 23px;
    height: 2px;
    background-color: #fff;
    margin: 4px 0;
    transition: 0.4s;
}

.change .bar1 {
    transform: rotate(-45deg) translate(-4px, 4px);
}

.change .bar2 {opacity: 0;}

.change .bar3 {
    transform: rotate(45deg) translate(-4px, -5px);
}


/* responsive menu */






/* accordion */

.accordion {
  cursor: pointer;
  padding: 10px;
  width: 100%;
  border: none;
  text-align: left;
  outline: none;
  font-size: 15px;
  transition: 0.4s;
  background-color:transparent;
  border:2px solid #fff;
  color:#fff;
  font-family:poppins;
  margin-bottom:5px;
  font-weight:600;
}

.red-area .active, .red-area .accordion:hover {
  background-color: #fff;
  border:2px solid #fff;
  color:#fe1839;
}


.red-area .accordion:hover:after {color:#fe1839;}


.active, .accordion:hover {
  background-color: #222;
  border:2px solid #fff;
}

.accordion:after {
  content: '\002B';
  color: #fff;
  font-weight: bold;
  float: right;
  margin-left: 5px;
}

.active:after {
  content: "\2212";
}

.panel {
  padding: 0px 0px;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.2s ease-out;
}

.panel div{
  border:1px solid #fff;
  padding:10px;
  margin-bottom:10px;
  background-color:#fff;
  color:#000;
}

.panel div p {margin:0px;}

/* accordion */












  .contact-container {
    max-width: 100%;
    margin: 30px auto 0px auto;
    background: #111;
    padding: 30px 40px;
    text-align: center;
  }

  .contact-container h2 {
    color: #fff;
    margin-bottom: 10px;
    font-size: 28px;
  }

  .contact-container p {
    color: #ccc;
    font-size: 14px;
    margin-bottom: 25px;
	text-align:center;
  }

  .contact-container form {
    display: flex;
    flex-direction: column;
    gap: 15px;
  }

  .contact-container input,
  .contact-container select,
  .contact-container textarea {
    background: #1a1a1a;
    color: #fff;
    border: 1px solid #333;
    border-radius: 0px;
    padding: 12px 15px;
    font-size: 15px;
    transition: 0.3s ease;
	font-family:poppins;
	
  }

  .contact-container input:focus,
  .contact-container select:focus,
  .contact-container textarea:focus {
    border-color: #666;
    outline: none;
  }

  .contact-container button {
    background: #ff1744;
    border: none;
    color: #fff;
    font-weight: 600;
    padding: 14px;
    border-radius: 0px;
    cursor: pointer;
    text-transform: uppercase;
    letter-spacing: 1px;
    transition: 0.3s ease;
	font-family:poppins;
	font-size:15px;
	letter-spacing:2px;
  }

  .contact-container button:hover {
    background: #ff4b68;
    transform: scale(1.02);
  }

  .contact-container .status {
    margin-top: 15px;
    font-size: 14px;
    color: #aaa;
  }

  #piercingTypeField {
    display: none;
    transition: 0.3s ease;
  }

  /* Hidden honeypot trap (for bots) */
  .hidden-field {
    display: none;
  }










  #piercing-notification {
    position: fixed;
    bottom: 20px;
    left: 20px;
    background: rgba(0, 0, 0, 0.9);
    color: #fff;
    border-left: 3px solid #d4af37;
    padding: 8px 14px;
    border-radius: 8px;
    font-family: 'Poppins', sans-serif;
    font-size: 13px;
    line-height: 1.3;
    box-shadow: 0 0 10px rgba(212,175,55,0.3);
    z-index: 9999;
    animation: slideIn 0.5s ease forwards;
    transition: all 0.3s ease;
    max-width: 220px;
  }

  #piercing-notification.hidden {
    display: none;
  }

  #piercing-notification:hover {
    box-shadow: 0 0 15px rgba(212,175,55,0.5);
    transform: scale(1.03);
  }

  @keyframes slideIn {
    from { transform: translateX(-80%); opacity: 0; }
    to { transform: translateX(0); opacity: 1; }
  }

  @keyframes slideOut {
    from { transform: translateX(0); opacity: 1; }
    to { transform: translateX(-80%); opacity: 0; }
  }
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
    #announcement-bar {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background: #000;
    color: #d4af37;
    font-family: 'Poppins', sans-serif;
    font-size: 12.5px;
    text-align: center;
    padding: 6px 10px;
    border-bottom: 1px solid rgba(212, 175, 55, 0.4);
    z-index: 9999;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    box-shadow: 0 0 6px rgba(212,175,55,0.25);
    animation: slideDown 0.5s ease forwards;
  }

  #announcement-bar a {
    color: #d4af37;
    text-decoration: underline;
    font-weight: 500;
  }

  #announcement-bar a:hover {
    text-decoration: none;
  }

  #close-bar {
    background: none;
    border: none;
    color: #d4af37;
    font-size: 14px;
    cursor: pointer;
    position: absolute;
    right: 12px;
    top: 5px;
    line-height: 1;
    transition: all 0.3s ease;
  }

  #close-bar:hover {
    transform: scale(1.2);
    color: #fff;
  }

  @keyframes slideDown {
    from { transform: translateY(-100%); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
  }

  @keyframes fadeText {
    0% { opacity: 0; transform: translateY(-5px); }
    20% { opacity: 1; transform: translateY(0); }
    80% { opacity: 1; transform: translateY(0); }
    100% { opacity: 0; transform: translateY(5px); }
  }

  @media (max-width: 600px) {
    #announcement-bar {
      font-size: 11.5px;
      padding: 5px 8px;
    }
    #close-bar {
      font-size: 13px;
      right: 8px;
      top: 4px;
    }
  }