/* =========================
   HERO SECTION
========================= */
.dr1055hero {
  position: relative;
  width: 100%;
  min-height: 90vh;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 90px 20px;
  overflow: hidden;
  isolation: isolate;
  color: #ffffff;
}

/* HTML Background Image */
.dr1055hero .hero-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
}

.dr1055hero .hero-bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  animation: heroZoom 18s ease-in-out infinite alternate;
  filter: saturate(1.05) contrast(1.05);
}

/* HERO BACKGROUND ZOOM */
@keyframes heroZoom {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(1.15);
  }
}

/* DARK HERO OVERLAY */
.dr1055hero .hero-overlay {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(135deg, rgba(6,18,28,0.70), rgba(18,40,54,0.60), rgba(0,120,160,0.35)),
    linear-gradient(to bottom, rgba(0,0,0,0.25), rgba(0,0,0,0.45));
  z-index: 1;
}

/* GLOW BALLS */
.dr1055hero .hero-glow {
  position: absolute;
  border-radius: 50%;
  filter: blur(60px);
  opacity: 0.65;
  z-index: 1;
  pointer-events: none;
}

.dr1055hero .hero-glow1 {
  width: 220px;
  height: 220px;
  background: rgba(0,255,213,0.30);
  top: 8%;
  left: 8%;
  animation: floatGlow1 8s ease-in-out infinite;
}

.dr1055hero .hero-glow2 {
  width: 260px;
  height: 260px;
  background: rgba(0,195,255,0.28);
  bottom: 10%;
  right: 8%;
  animation: floatGlow2 10s ease-in-out infinite;
}

@keyframes floatGlow1 {
  0%,100% {transform: translateY(0) translateX(0) scale(1);}
  50% {transform: translateY(-30px) translateX(18px) scale(1.08);}
}

@keyframes floatGlow2 {
  0%,100% {transform: translateY(0) translateX(0) scale(1);}
  50% {transform: translateY(24px) translateX(-18px) scale(1.10);}
}

/* HERO CONTENT */
.dr1055hero .hero-container {
  position: relative;
  z-index: 2;
  max-width: 960px;
  width: 100%;
}

/* GLASS HERO CARD */
.dr1055hero .hero-intro {
  background: rgba(255,255,255,0.10);
  border: 1px solid rgba(255,255,255,0.18);
  border-radius: 24px;
  padding: 40px 32px;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  box-shadow: 0 20px 50px rgba(0,0,0,0.25), inset 0 1px 0 rgba(255,255,255,0.18);
  position: relative;
  overflow: hidden;
  animation: heroContentUp 1s ease both;
}

/* Shine animation */
.dr1055hero .hero-intro::before {
  content:"";
  position:absolute;
  top:0;
  left:-140%;
  width:70%;
  height:100%;
  background:linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,0.18), rgba(255,255,255,0));
  transform:skewX(-20deg);
  animation:shineSweep 3.8s linear infinite;
}

@keyframes shineSweep {
  0%{left:-140%;}
  100%{left:170%;}
}

@keyframes heroContentUp {
  0%{opacity:0; transform:translateY(24px);}
  100%{opacity:1; transform:translateY(0);}
}

/* HERO TITLE */
.dr1055hero h2 {
  font-size:46px;
  font-weight:700;
  line-height:1.25;
  margin-bottom:18px;
  color:#ffffff;
  text-shadow: 0 4px 18px rgba(0,0,0,0.45);
  animation: heroTextFade 1.2s ease both;
}

/* HERO DESCRIPTION */
.dr1055hero .hero-description {
  font-size:18px;
  line-height:1.8;
  color:rgba(255,255,255,0.96);
  margin-bottom:34px;
  text-shadow:0 2px 14px rgba(0,0,0,0.50);
  animation: heroTextFade 1.4s ease both;
}

/* HERO BUTTONS */
.dr1055hero .hero-actions {
  display:flex;
  justify-content:center;
  gap:18px;
  flex-wrap:wrap;
  animation: heroTextFade 1.6s ease both;
}

/* Primary button */
.dr1055hero .btn-primary {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:15px 30px;
  border-radius:50px;
  font-size:15px;
  font-weight:700;
  text-decoration:none;
  color:#07212d;
  background:linear-gradient(135deg, #7dfff0, #00ffd5, #62d8ff);
  box-shadow:0 10px 24px rgba(0,255,213,0.28), inset 0 1px 0 rgba(255,255,255,0.65);
  transition:all 0.3s ease;
}

.dr1055hero .btn-primary:hover {
  transform:translateY(-4px) scale(1.02);
  box-shadow:0 16px 34px rgba(0,255,213,0.34);
}

/* Secondary button */
.dr1055hero .btn-secondary {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:15px 30px;
  border-radius:50px;
  font-size:15px;
  font-weight:700;
  text-decoration:none;
  color:#ffffff;
  border:1.5px solid rgba(255,255,255,0.55);
  background:rgba(255,255,255,0.08);
  backdrop-filter:blur(8px);
  transition:all 0.3s ease;
}

.dr1055hero .btn-secondary:hover {
  transform:translateY(-4px) scale(1.02);
  background:rgba(255,255,255,0.16);
}

/* HERO TEXT FADE ANIMATION */
@keyframes heroTextFade {
  0%{opacity:0; transform:translateY(18px);}
  100%{opacity:1; transform:translateY(0);}
}

/* TABLET RESPONSIVE */
@media (max-width:768px){

  .dr1055hero{
    min-height:70vh;
    padding:70px 16px;
    animation:none;
    filter: saturate(1.1) contrast(1.05);
  }

  .dr1055hero .hero-overlay{
    background: linear-gradient(180deg, rgba(0,0,0,0.25), rgba(0,0,0,0.3));
  }

  .dr1055hero .hero-intro{
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
    background:rgba(0,0,0,0.25);
  }

  .dr1055hero h2{font-size:30px; text-shadow:0 3px 12px rgba(0,0,0,0.6);}
  .dr1055hero .hero-description{font-size:16px; text-shadow:0 2px 10px rgba(0,0,0,0.5);}
}

/* SMALL MOBILE RESPONSIVE */
@media (max-width:480px){
  .dr1055hero{
    padding:56px 14px;
    min-height:70vh;
  }
  .dr1055hero h2{font-size:25px;}
  .dr1055hero .hero-description{font-size:15px;}
}