/* RentDo24 vanilla styles */
.gradient-text{
  background: linear-gradient(135deg, #ff8a3d, #ffa86a);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.grid-bg{
  background-image:
    linear-gradient(rgba(255,138,61,.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,138,61,.06) 1px, transparent 1px);
  background-size: 60px 60px;
}
.no-scrollbar::-webkit-scrollbar{display:none;}
.no-scrollbar{scrollbar-width:none;}

/* Phone mockup */
.phone-mockup{
  position: relative;
  width: 240px;
  border-radius: 2.5rem;
  border: 10px solid #0a0a0a;
  background: #0a0a0a;
  box-shadow: 0 30px 80px -20px rgba(255,140,60,.4);
  transition: transform .5s cubic-bezier(.22,1,.36,1);
}
.phone-mockup:hover{transform: translateY(-8px);}
.phone-notch{
  position:absolute; left:50%; top:8px; z-index:20;
  height:20px; width:80px; transform: translateX(-50%);
  background:#000; border-radius: 9999px;
}
.phone-screen{
  position: relative;
  aspect-ratio: 9 / 19.5;
  overflow: hidden;
  border-radius: 1.8rem;
  background: #faf5ef;
}
.phone-img{
  position:absolute; inset:0; width:100%; height:100%;
  object-fit: cover; object-position: top;
  transition: opacity .5s ease, transform .5s ease;
}
.phone-img.fading{ opacity: 0; transform: scale(1.04); }

/* Reveal on scroll */
.reveal{opacity:0; transform: translateY(30px); transition: opacity .7s ease, transform .7s ease;}
.reveal.visible{opacity:1; transform: none;}

/* Social button */
.social-btn{
  display:grid; place-items:center;
  height:2.25rem; width:2.25rem;
  border-radius: 9999px;
  border: 1px solid #463527;
  transition: color .2s, border-color .2s;
}
.social-btn:hover{ color:#ff8a3d; border-color:#ff8a3d; }

/* Feature card hover */
.feature-card{ position: relative; overflow: hidden; }
.feature-card::before{
  content:""; position:absolute; right:-1.5rem; top:-1.5rem;
  height:6rem; width:6rem; border-radius:9999px;
  background: rgba(255,138,61,.10); filter: blur(30px);
  transition: background .3s;
}
.feature-card:hover::before{ background: rgba(255,138,61,.25); }

/* Category hover */
.cat-card{transition: transform .3s, border-color .3s, background .3s;}
.cat-card:hover{transform: translateY(-6px);}

/* Founder float */
.founder-avatar{ animation: floatSlow 6s ease-in-out infinite; }
@keyframes floatSlow{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}