:root {
    --star-size: 40px;
    --slow: 12s;
    --slower: 18s;
    --slowest: 24s;
    --easing: cubic-bezier(.42,0,.58,1);
  }
  
  .hero {
    position: relative;
    min-height: 60vh;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
  }
  
  .floating-stars {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 999;
    overflow: hidden;
  }
  
  .star {
    position: absolute;
    width: var(--star-size);
    height: var(--star-size);
    transform-origin: center;
    will-change: transform, opacity;
    filter: drop-shadow(0 4px 10px rgba(0,0,0,0.35));
    opacity: 0.95;
  }
  
  /* Pattern 1: soft bob */
  .star--1 {
    left: 10%;
    top: 20%;
    animation: float1 var(--slow) var(--easing) infinite;
  }
  
  @keyframes float1 {
    0%   { transform: translate3d(0,0,0) rotate(0deg) scale(1); opacity:.95; }
    25%  { transform: translate3d(60px,-40px,0) rotate(10deg) scale(1.03); opacity:1; }
    50%  { transform: translate3d(0,-80px,0) rotate(20deg) scale(1.02); opacity:.9; }
    75%  { transform: translate3d(-60px,-40px,0) rotate(10deg) scale(0.98); opacity:1; }
    100% { transform: translate3d(0,0,0) rotate(0deg) scale(1); opacity:.95; }
  }
  
  /* ✅ Pattern 2: continuous smooth drifting orbit */
  .star--2 {
    left: 50%;
    top: 35%;
    transform-origin: 100px 100px; /* orbit radius */
    animation: orbit2 var(--slower) linear infinite;
  }
  
  @keyframes orbit2 {
    0%   { transform: rotate(0deg) translateX(120px) rotate(0deg) scale(1); opacity:.9; }
    25%  { transform: rotate(90deg) translateX(120px) rotate(-90deg) scale(1.02); opacity:1; }
    50%  { transform: rotate(180deg) translateX(120px) rotate(-180deg) scale(1); opacity:.95; }
    75%  { transform: rotate(270deg) translateX(120px) rotate(-270deg) scale(1.02); opacity:1; }
    100% { transform: rotate(360deg) translateX(120px) rotate(-360deg) scale(1); opacity:.9; }
  }
  
  /* Pattern 3: similar orbit but slower/smaller */
  .star--3 {
    left: 80%;
    top: 18%;
    transform-origin: 80px 60px;
    animation: orbit3 var(--slowest) var(--easing) infinite;
  }
  
  @keyframes orbit3 {
    0%   { transform: rotate(0deg) translateX(60px) rotate(0deg) scale(1); opacity:.9; }
    25%  { transform: rotate(90deg) translateX(60px) rotate(-90deg) scale(1.03); opacity:1; }
    50%  { transform: rotate(180deg) translateX(60px) rotate(-180deg) scale(1); opacity:.85; }
    75%  { transform: rotate(270deg) translateX(60px) rotate(-270deg) scale(1.02); opacity:1; }
    100% { transform: rotate(360deg) translateX(60px) rotate(-360deg) scale(1); opacity:.9; }
  }
  

  /*
  
.floating-ship-box {
  position: absolute;
  z-index: 999 !important;
  top: 50%;
  left: 50%;
  width: min(30vw, 381px);
  height: min(60vh, 780px);
  transform: translate(-50%, -50%) translateY(var(--scroll-offset, 0px));
  transition: transform 0.1s ease-out;
}

  */


/*
.floating-ship-box {
  z-index: 999 !important;
  top: 50%;
  left: 50%;
  width: min(30vw, 381px);
  height: min(60vh, 780px);
  translate(calc(100% + 10vw), 0%) translateY(var(--scroll-offset, 0px));
  transition: transform 0.1s ease-out;
}
*/

.floating-ship-box {
  position: absolute;
  left: 50%;
  margin-left: -190px;  
  z-index: 999 !important;
  width: min(30vw, 381px);
  height: min(60vh, 780px);
  transform: translate(-50%, -30%) translateY(var(--scroll-offset, 0px));
  transition: transform 0.1s ease-out;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  box-sizing: border-box;
  margin: 0px auto; /* Example: center horizontally with margin and give some top space */
}



@media only screen and (min-width: 768px) and (max-width: 991px) {
  .floating-ship-box {
    position: relative;
    top: 30px;
    top: 350px;
    width: 100%;
  }
}
@media (max-width: 767px) {
  .floating-ship-box {
    position: relative;
    top: 250px;
    width: 100%;
  }
}

/*
.hero24-section img.hero24-shape1 {
  position: absolute;
  z-index: 2;
  left: 50%;
  margin-left: -190px;
  top: 220px;
}
 

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .hero24-section img.hero24-shape1 {
    position: relative;
    top: 30px;
  }
}
@media (max-width: 767px) {
  .hero24-section img.hero24-shape1 {
    position: relative;
    top: 30px;
  }
}
   */



.texto-tira{
  color: white;
  padding-top: 10px;
  padding-bottom: 20px;
  font-size: 35px;  
}


.marquee-text{
  margin-top: -18px !important;
}







/**Bottom Rocket**/

/* Container to easily control position */
.rocket-bottom-container {
  position: relative;
  display: inline-block;
}

/* Rocket image */
.rocket-bottom {
  display: block;
  animation: rocket-bottom-float 2.5s ease-in-out infinite;
  transform-origin: center;
}

/* Animation definition */
@keyframes rocket-bottom-float {
  0% {
    transform: rotate(-10deg) translate(0, 0);
  }
  25% {
    transform: rotate(-8deg) translate(-3px, -3px);
  }
  50% {
    transform: rotate(-11deg) translate(-6px, -6px);
  }
  75% {
    transform: rotate(-9deg) translate(-3px, -3px);
  }
  100% {
    transform: rotate(-10deg) translate(0, 0);
  }
}








/**Aside (Suporte)**/


		.asideSuporte a {
		text-decoration: none;
		}
		.asideSuporte ul {
		list-style: none;
		margin: 0;
		padding: 0;
		}
		.asideSuporte {
		left: -10px;
		position: fixed;
		top: 150px;
		}
		.asideSuporte a {
		background: #333;
		color: #fff;
		display: block;
		height: 50px;
		font: 16px "Open Sans", sans-serif;
		line-height: 50px;
		position: relative;
		text-align: center;
		width: 50px;
		}
		.asideSuporte a span {
		line-height: 50px;
		left: -120px;
		position: absolute;
		top:0;
		text-align:center;
		width:130px;
		}

		.asideSuporte a:hover span {
		left: 100%;
		}

    .asideSuporte span{
      padding-right: 5px;
    }

		.asideSuporte a.teamViwer,
		.asideSuporte a.teamViwer:hover,
		.asideSuporte a.teamViwer span { background: #0071b9; }

		.asideSuporte a.anyDesk,
		.asideSuporte a.anyDesk:hover,
		.asideSuporte a.anyDesk span { background: #fc4236; }

    .asideSuporte img {width:30px !important;height:30px !important}

		.asideSuporte a.rustDesk,
		.asideSuporte a.rustDesk:hover,
		.asideSuporte a.rustDesk span { background: #f6f6f6 }

		.asideSuporte img{width:50px;height:50px;padding-right:1px}

		@media(max-width: 800px){
			.asideSuporte{
				display: none
			}

      .suporteRemotoFooter{
        display:none;
      }
		}

		#divAvisoContent {
				width: 60%;height: 50%;margin-left: 20%;margin-right: 20%;background-color: white;margin-top:150px;border-radius: 10px;position:relative;height: auto;
		}

		@media(max-width: 720px){
			#divAvisoContent {
				width: 90%;height: 50%;margin-left: 5%;margin-right: 5%;background-color: white;margin-top:150px;border-radius: 10px;position:relative;height: auto;
			}
		}



/**Div Typing**/
.circleDiv {
    position: relative;
    width: 320px;
    height: 320px;
    border-radius: 50%;
    overflow: hidden;
}

/* Background GIF */
.circleDiv .bgImg {
    width: 100%;
    height: 100%;
    object-fit: cover;
    /*filter: blur(8px);*/
    transform: scale(1.1); /* prevents edges from showing after blur */
}

/* Center logo */
.circleDiv .logoImg {
    position: absolute;
    width: 130px;
    height: 130px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}


/* WhatsApp icon */
.whatsapp-floating-btn {
    position: fixed;
    z-index: 9;
    top: calc(100% - 80px);
    left: 30px;

    width: 64px;
    height: 64px;
    background-color: rgba(18, 190, 94, 1);
    color: white;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;

    cursor: pointer;
}


.whatsapp-icon {
    font-size: 38px; /* adjust size */
    line-height: 1;
}




/*** Popup ***/
/* Backdrop */
.backdrop{
position:fixed;inset:0;display:flex;align-items:center;justify-content:center;
background:rgba(2,6,23,0.55);
backdrop-filter:blur(6px) saturate(1.05);
z-index:50;
opacity:0;pointer-events:none;
transition:opacity .28s cubic-bezier(.2,.9,.2,1);
}
.backdrop.show{opacity:1;pointer-events:auto}


/* Card */
.modal-personal{
width:clamp(300px,44vw,520px);
background:linear-gradient(180deg, rgba(255,255,255,0.98), rgba(250,250,250,0.96));
color:#0b1220;
border-radius:var(--radius);
box-shadow:0 18px 50px rgba(2,6,23,0.6);
padding:20px;
transform:translateY(12px) scale(.98);
opacity:0;
transition:transform .32s cubic-bezier(.2,.9,.2,1), opacity .28s ease;
will-change:transform, opacity;
border:1px solid rgba(11,17,32,0.06);
}
.backdrop.show .modal-personal{transform:translateY(0) scale(1);opacity:1}


.modal-personal-header{display:flex;gap:12px;align-items:center}
.modal-personal-title{font-size:18px;font-weight:700}
.modal-personal-desc{color:var(--muted);font-size:14px;margin-top:8px}


.actions{display:flex;gap:10px;justify-content:flex-end;margin-top:18px}


.btn-ghost{
background:transparent;border:1px solid rgba(11,17,32,0.06);padding:10px 14px;border-radius:10px;cursor:pointer;font-weight:600
}
.btn-ghost:focus{outline:3px solid rgba(99,102,241,0.14)}


.btn-danger{background:linear-gradient(180deg,#ef4444,#dc2626);color:white;border:0;padding:10px 14px;border-radius:10px;font-weight:700;cursor:pointer}
.btn-danger:focus{outline:3px solid rgba(239,68,68,0.14)}


/* Small visual flourish */
.icon-circle{width:44px;height:44px;border-radius:10px;display:grid;place-items:center;background:linear-gradient(180deg,#eef2ff,#e0e7ff);box-shadow:0 6px 18px rgba(99,102,241,.12)}


/* Accessibility / reduced motion */
@media (prefers-reduced-motion: reduce){
.backdrop, .modal-personal{transition:none}
}


/* Simple focus trap hint (in case JS disabled) */
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}