*{box-sizing:border-box}
html,body{margin:0;padding:0;font-family:Poppins,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:#1f2a37}
body{min-height:100vh;display:flex;flex-direction:column}
.container{max-width:1200px;margin:0 auto;padding:0 20px}
.topbar{background:#0f172a;color:#cbd5e1;font-size:13px}
.topbar .container{display:flex;justify-content:space-between;align-items:center;padding:8px 20px}
.top-left .item{margin-right:12px}
.social{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:50%;background:#1e293b;color:#e2e8f0;text-decoration:none;font-size:12px;margin-left:6px}

.header{background:#ffffff;box-shadow:0 2px 8px rgba(0,0,0,.06);position:sticky;top:0;z-index:20}
.header .container{display:flex;align-items:center;gap:24px;padding:16px 20px}
.logo{font-weight:700;font-size:20px;color:#f18f2a}
.header .logo{display:inline-flex;align-items:center;gap:8px}
.header .logo img{height:40px}
.nav{display:flex;gap:16px;flex:1}
.nav a{color:#f18f2a;text-decoration:none;padding:10px;border-radius:8px}
.nav a:hover{background:#f1f5f9}
.nav-logo{height:40px}
.dropdown{position:relative}
.dropbtn{background:transparent;border:none;color:#f18f2a;padding:10px;border-radius:8px;font-weight:500}
.dropbtn:hover{background:#f1f5f9}
.dropdown-content{display:none;position:absolute;top:38px;left:0;background:#ffffff;border:1px solid #e5e7eb;border-radius:12px;min-width:200px;box-shadow:0 8px 20px rgba(0,0,0,.08);z-index:30}
.dropdown-content a{display:block;padding:10px 12px;color:#f18f2a;text-decoration:none}
.dropdown-content a:hover{background:#f8fafc}
.dropdown:hover .dropdown-content{display:block}
.actions{display:flex;align-items:center;gap:12px}
.btn{display:inline-block;padding:10px 16px;border-radius:10px;text-decoration:none;font-weight:600}
.btn.primary{background:#1e7893;color:#fff}
.header .actions .btn.primary{color:#f18f2a}
.pulse{animation:pulse 1.2s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.6;transform:scale(.98)}}
.btn.secondary{background:#e2e8f0;color:#0f172a}
.btn.ghost{border:1px solid #cbd5e1;color:#0f172a;background:transparent}
.menu{display:none;background:#1e7893;color:#fff;border:none;border-radius:8px;padding:10px 12px}

.hero{background:#f5f3f0}
.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center;padding:48px 20px}
.hero-text h1{font-size:40px;line-height:1.15;margin:0 0 16px;color:#0f172a}
.hero-text p{color:#334155;margin:0 0 20px}
.hero-actions{display:flex;gap:12px}
.hero-media{width:100%}
.mosaic{display:grid;grid-template-columns:1fr 1fr;grid-auto-rows:180px;gap:14px}
.mosaic a{display:block;height:100%}
.mosaic img{width:100%;height:100%;object-fit:cover;border-radius:14px}
.social-float{position:fixed;left:12px;top:40%;display:flex;flex-direction:column;gap:6px}
.social-float a{background:#1e7893;color:#fff;text-decoration:none;padding:8px 10px;border-radius:8px;font-size:14px}
.social-float i{font-size:16px}

.about{background:#ffffff;padding:56px 0}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:center}
.about .img img{width:100%;border-radius:16px}
.about .text h2{font-size:28px;margin:0 0 10px;color:#f18f2a}
.about .text p{color:#475569;margin:0 0 16px}

.services{background:#f8fafc;padding:56px 0}
.services .container{background:#ffffffcc;border-radius:24px;padding:28px}
.services h2{margin:0 0 16px;color:#f18f2a}
.cards{display:grid;grid-template-columns:repeat(5,1fr);gap:16px}
.card{background:#ffffff;border:1px solid #e5e7eb;border-radius:16px;overflow:hidden}
.card img{width:100%;height:160px;object-fit:cover}
.card-body{padding:14px}
.card-body h3{margin:0 0 6px;font-size:16px;color:#f18f2a}
.card-body p{margin:0 0 8px;color:#64748b;font-size:14px}
.link{color:#1e7893;text-decoration:none;font-weight:600}

.projects{background:#ffffff;padding:56px 0}
.projects h2{margin:0 0 18px;color:#f18f2a}
.carousel{position:relative}
.slide{display:none}
.slide.active{display:block}
.slide img{width:100%;border-radius:16px}
.slide-caption{position:absolute;left:24px;bottom:24px;background:#ffffffcc;color:#0f172a;padding:10px 12px;border-radius:10px}
.controls{position:absolute;right:24px;bottom:24px;display:flex;gap:8px}
.controls button{background:#1e7893;color:#fff;border:none;border-radius:8px;padding:8px 10px}

.team{background:#f8fafc;padding:56px 0}
.team-cards .team-card img{height:180px}
.team h2{color:#f18f2a}
/* Yönetim isimlerini siyah tut */
.team .card-body h3{color:#0f172a}

.pricing{background:#ffffff;padding:86px 0}
.pricing-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.pricing h2 .logo-square{display:inline-block;width:150px;height:150px;border:1px solid #e5e7eb;border-radius:6px;background:#f8fafc;margin-right:8px;vertical-align:middle;background-image:url('assets/rinlogo.png');background-size:cover;background-position:center}
.pricing h2{color:#f18f2a}
.pricing-card{border:1px solid #e5e7eb;border-radius:16px;padding:20px;background:#f9fafb}
.pricing-card .pricing-head{font-weight:600;color:#f18f2a;margin-bottom:8px}
.pricing-card .price{font-size:20px;color:#1e7893;margin-bottom:12px}
.pricing-card ul{margin:0 0 16px 18px;color:#475569}
.pricing-card.featured{background:#e2f3f7;border-color:#9bd3e4}
.pricing-card.platin{display:flex;gap:20px;align-items:center}
.pricing-card.platin .pricing-head{font-weight:700;color:#f18f2a;margin-bottom:0;font-size:22px;min-width:220px}
.pricing-card.platin .price{font-size:18px;color:#1e7893;margin:0;min-width:240px}
.pricing-card.platin .platin-text{flex:1}
.pricing-card.platin ul{display:block;margin:0 0 0 18px}
.pricing-card.platin ul li{background:transparent;border:none;border-radius:0;padding:0;color:#475569;list-style:disc}

.blog{background:#f8fafc;padding:56px 0}
.blog h2{color:#f18f2a}

.footer{background:#0f172a;color:#cbd5e1;padding:40px 0;margin-top:auto}
.footer-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.footer a{color:#e2e8f0;text-decoration:none}
.footer h4{color:#f18f2a}
.footer a.media-link{color:#ffffff}
.logo2{max-height:48px;filter:brightness(1.2)}
.copy{margin-top:16px;text-align:center;color:#94a3b8}

.slogan{font-weight:700;font-family:"Dancing Script",cursive;background:linear-gradient(90deg,#ff8c00,#ff0000,#00a651,#0066ff,#8000ff);background-size:300% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:gradientScroll 6s linear infinite}
/* Hizmet kartlarındaki sloganları kırmızı ve biraz büyük yap */
.services .card-body .slogan{color:#FF0000 !important;font-size:16px !important;background:none !important;-webkit-background-clip:initial !important;background-clip:initial !important;animation:none !important}
@keyframes gradientScroll{0%{background-position:0% 0}100%{background-position:100% 0}}

.float-cta{position:fixed;left:16px;bottom:16px;display:flex;flex-direction:column;gap:12px;z-index:60}
.cta-btn{--c:30,120,147;width:56px;height:56px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;text-decoration:none;box-shadow:0 8px 24px rgba(0,0,0,.18);position:relative}
.cta-btn.phone{background:#1e7893;--c:30,120,147}
.cta-btn.whatsapp{background:#25D366;--c:37,211,102}
.cta-btn i{font-size:22px;animation:iconBlink 1.6s ease-in-out infinite}
.cta-btn::before{content:"";position:absolute;inset:-16px;border-radius:50%;background:radial-gradient(circle, rgba(var(--c),.34) 0%, rgba(var(--c),0) 60%);animation:ripple 2.4s ease-out infinite}
.cta-btn::after{content:"";position:absolute;inset:-28px;border-radius:50%;background:radial-gradient(circle, rgba(var(--c),.22) 0%, rgba(var(--c),0) 70%);animation:ripple2 2.4s .6s ease-out infinite}
@keyframes ripple{0%{transform:scale(.95);opacity:.9}60%{transform:scale(1.15);opacity:.25}100%{transform:scale(1.25);opacity:0}}
@keyframes ripple2{0%{transform:scale(.9);opacity:.8}60%{transform:scale(1.2);opacity:.2}100%{transform:scale(1.3);opacity:0}}
@keyframes iconBlink{0%,100%{opacity:1;filter:drop-shadow(0 0 6px rgba(var(--c),.5))}50%{opacity:.7;filter:drop-shadow(0 0 12px rgba(var(--c),.8))}}

.references{background:#ffffff;padding:40px 0}
.references h2{margin:0 0 16px;color:#f18f2a}
.brands{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}
.brand{background:#f8fafc;border:1px solid #e5e7eb;border-radius:12px;min-height:80px;display:flex;align-items:center;justify-content:center;color:#334155;font-weight:600;text-decoration:none;padding:10px;text-align:center;line-height:1.25;overflow-wrap:anywhere}

.video-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.video-card{display:block;text-decoration:none;color:#0f172a}
.video-card .card-body h3{margin:8px 0 4px;font-size:16px;color:#0f172a}
.video-card .card-body p{margin:0;color:#64748b;font-size:14px}

.modal{position:fixed;left:0;top:0;width:100%;height:100%;background:rgba(0,0,0,.6);display:none;align-items:center;justify-content:center;z-index:100}
.modal.show{display:flex}
.modal-inner{background:#000;border-radius:12px;max-width:900px;width:90%;aspect-ratio:16/9;position:relative;overflow:hidden}
.modal-inner iframe{width:100%;height:100%;border:0}
.modal-close{position:absolute;right:8px;top:8px;background:#ffffff;color:#0f172a;border:none;border-radius:50%;width:32px;height:32px;display:flex;align-items:center;justify-content:center;cursor:pointer}
.modal-open{position:absolute;left:8px;top:8px;background:#ffffff;color:#0f172a;text-decoration:none;border-radius:8px;padding:8px 10px;font-weight:600}

.ref-controls{display:flex;gap:8px;margin:8px 0 16px}
.ref-controls input{flex:1;padding:8px 10px;border:1px solid #e5e7eb;border-radius:10px}
.ref-del{position:absolute;right:8px;top:8px;background:#ef4444;color:#fff;border:none;border-radius:50%;width:24px;height:24px;display:flex;align-items:center;justify-content:center;cursor:pointer}
.brand{position:relative}

img{max-width:100%;height:auto;display:block}
.slide img{width:100%;height:auto}
.card img{width:100%;height:auto;object-fit:cover}
.team-cards .team-card img{width:100%;height:auto}
.svc-img{max-width:100%;height:auto}
.mosaic img{width:100%;height:100%;object-fit:cover}

.preloader{position:fixed;left:0;top:0;width:100%;height:100%;background:#0f172a;display:flex;align-items:center;justify-content:center;z-index:10000;opacity:1;transition:opacity .2s ease}
.preloader.hide{opacity:0}
.preloader-inner{text-align:center}
.preloader .logos{display:flex;align-items:center;justify-content:center;gap:16px;margin-bottom:12px}
.preloader .logos img{height:140px}
.preloader .percent{color:#f18f2a;font-weight:700;font-size:18px}

@media(max-width:1024px){
  .cards{grid-template-columns:repeat(3,1fr)}
  .mosaic{grid-auto-rows:140px}
  .video-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:768px){
  .nav{display:none}
  .menu{display:inline-block}
  .hero-grid{grid-template-columns:1fr}
  .two-col{grid-template-columns:1fr}
  .cards{grid-template-columns:repeat(2,1fr)}
  .pricing-cards{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr 1fr}
  .brands{grid-template-columns:repeat(3,1fr)}
  .video-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:520px){
  .cards{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr}
  .brands{grid-template-columns:repeat(2,1fr)}
  .video-grid{grid-template-columns:1fr}
}