/* ==========================================================================
   Yaşam Spa Merkezi — siteye özel stiller
   Not: Bu dosya, WordPress kurulumunda tema seçenekleri + Elementor
   tarafından satır içi üretilen tüm kuralların temizlenmiş karşılığıdır.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1) Tipografi
   -------------------------------------------------------------------------- */
body, p, input, button, textarea, select, ul li { font-family: 'Rubik', sans-serif; }
h1, h2, h3, h4, h5, h6 { font-family: 'Domine', serif; }

/* --------------------------------------------------------------------------
   2) Marka renkleri
   Ana renk: #e8d2b8 · Vurgu (pembe): #ec5598 · İkincil (mor): #6a1b9a
   -------------------------------------------------------------------------- */
.border-btn:hover, .theme-btn, .black-btn:hover, .slider-active button:hover,
.service-content a, .team-wrapper:hover .team-text, .b-cat a, .theme-bg,
.brown-btn, .grey-btn:hover, .service-list a::before, .features-items .icon,
.grid-wrapper::before, .service-arch-content .service-icon,
.service-price-inner .pricing-amount, .tagcloud a:hover, .blog-post-tag a:hover {
    background: #e8d2b8;
}

.feature-icon i, .team-text span, .main-menu ul li ul.sub-menu li:hover > a,
.main-menu ul li:hover > a, .single-slider.style-3 h6, .header-right li a:hover,
.main-menu.style-3 li:hover a, .main-menu.style-3 li .sub-menu li a:hover,
.service-list .icon i, .service-caption .service-pricing span,
.breadcrumb-menu ul li a, .breadcrumb-menu li,
.service-arch-content ul li a.brown-color, .service-arch-content h4:hover,
.widget-posts-title a:hover, .post-meta span a:hover, .blog-title a:hover,
.widget li a:hover {
    color: #e8d2b8;
}

.header-btn a, .about-border, .border-btn, .footer-contact form button,
.brown-btn, .grey-btn:hover, .widget, .blog-post-tag a:hover {
    border-color: #e8d2b8;
}

.main-header, .blue-btn:hover, .pink-btn, .gallery-image::before,
.appointment-img::before, .intro-content ul li:hover i, .intro-img a:hover,
.pricing-item.active {
    background: #ec5598;
}

.blog-content h3 a:hover, .top-icon i, .slider-content.hp-1 h6,
.appointment-intro.hp-1 h6, .single-content span, .intro-content ul li i,
.intro-img a, .single-item h5, .pricing-list li .fa-check,
.post-meta span i, .post-text blockquote footer, .contact i {
    color: #ec5598;
}

.blue-btn, .pink-btn:hover, .single-content .team-social li a:hover { background: #6a1b9a; }
.main-menus nav ul li.active a { color: #6a1b9a; }
.video-links a:hover { border-color: #6a1b9a; }

/* --------------------------------------------------------------------------
   3) Genel düzeltmeler (eski özel CSS karşılıkları)
   -------------------------------------------------------------------------- */
a.standard-logo img { width: 500px; max-width: 100%; height: auto; }
/* Randevu butonu tek satır kalsın; üst bardaki bilgiler ise sığmazsa alta sarsın */
.get-in-btn a { white-space: nowrap; }
.header-support { min-width: 0; }
.header-support .support-text { overflow: visible; }
/* Etiket satiri ("Çalışma Saatleri" gibi) ikiye bolunmesin */
.header-support .support-text li.rubik { white-space: nowrap; }
/* 1200-1499px arasinda ust bar bilgileri tek satirda kalsin */
@media (min-width: 1200px) and (max-width: 1499px) {
    .header-info .header-support { margin-right: 16px; }
    .header-support .support-text li { white-space: nowrap; }
    .header-support .support-text li.rubik { font-size: 12.5px; }
    .header-support .support-text li.opensens { font-size: 13.5px; }
    .get-in-btn a { padding-left: 22px; padding-right: 22px; }
}
#scrollUp { display: none !important; }
.mt-50 { margin-top: 30px; }
.mt-30 { margin-top: 0; }
img { max-width: 100%; height: auto; }

/* --------------------------------------------------------------------------
   4) İç sayfa başlık bandı
   -------------------------------------------------------------------------- */
.breadcrumb-spacing { background: #222; padding-top: 150px; padding-bottom: 150px; }
.breadcrumb-bg { background-size: cover; background-position: center center; }
.breadcrumb-title { color: #fff; margin: 0; font-size: 44px; line-height: 1.2; }
@media (max-width: 767px) {
    .breadcrumb-spacing { padding-top: 90px; padding-bottom: 90px; }
    .breadcrumb-title { font-size: 28px; }
}

/* --------------------------------------------------------------------------
   5) Bölüm boşlukları (Elementor bölüm dolgularının karşılığı)
   -------------------------------------------------------------------------- */
.ys-sec-hizmet-baslik  { padding: 25px 0 55px; }
.ys-sec-kutular        { padding: 0 0 100px; }
.ys-sec-kartlar        { padding: 100px 0 55px; }
.ys-sec-paketler       { padding: 100px 0 0; }
.ys-sec-galeri-baslik  { padding: 100px 0 55px; }
.ys-sec-galeri         { padding: 0 0 70px; }
.ys-sec-blog-baslik    { padding: 50px 0 40px; }
.ys-sec-blog           { padding: 0 0 20px; }
.ys-sec-ic             { padding: 100px 0 70px; }
.ys-sec-galeri-serit   { padding: 0 0 100px; }

/* Elementor'daki 992–1024px aralığında 2 sütuna düşme davranışı */
@media (min-width: 992px) and (max-width: 1024px) {
    .ys-sec-kutular .col-lg-4,
    .ys-sec-kartlar .col-lg-4 { flex: 0 0 50%; max-width: 50%; }
}

/* --------------------------------------------------------------------------
   6) Hero slider
   -------------------------------------------------------------------------- */
.ys-hero { margin-top: -12px; }
.ys-hero .ys-hero-item { text-align: center; }
/* Görseller doğal genişliğinde ve ortalanır — canlı sitedeki davranış */
.ys-hero .ys-hero-item img,
.ys-hero .owl-item img { width: auto; max-width: 100%; display: inline-block; }
.ys-hero .owl-dots { text-align: center; padding-top: 10px; }
.ys-hero .owl-dots .owl-dot { display: inline-block; }
.ys-hero .owl-dots .owl-dot span {
    display: block; width: 6px; height: 6px; margin: 5px 4px;
    background: #000; opacity: .2; border-radius: 50%;
    transition: opacity .2s ease;
}
.ys-hero .owl-dots .owl-dot.active span,
.ys-hero .owl-dots .owl-dot:hover span { opacity: 1; }

/* --------------------------------------------------------------------------
   7) Hakkımızda bloğu
   -------------------------------------------------------------------------- */
.ys-about-sec {
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 50px 0;
}
.ys-about-title { font-size: 53px; line-height: 1.2; margin-bottom: 25px; }
@media (max-width: 767px) {
    .ys-about-sec { padding: 0; background-position: center right; }
    .ys-about-title { font-size: 31px; }
}

/* --------------------------------------------------------------------------
   8) Paketler
   -------------------------------------------------------------------------- */
.ys-tab-wrap { margin-bottom: 30px; justify-content: flex-end; }
.ys-tab-wrap .pricing-item { cursor: default; }
.pricing-plan { position: relative; }
/* .badge şeridinin görünümü temadan gelir (sarı kurdele) — burada ezilmez */
.bdevs-feature-list { list-style: none; padding: 0; margin: 0; }
.bdevs-feature-list li { margin-bottom: 10px; }
.bdevs-feature-list li i { margin-right: 8px; }

/* --------------------------------------------------------------------------
   9) "Neden biz" bölümü
   -------------------------------------------------------------------------- */
.ys-neden-sec {
    position: relative;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 100px 0;
}
.ys-neden-sec .container { position: relative; z-index: 2; }
.ys-neden-title { font-size: 46px; line-height: 1.2; margin-bottom: 27px; color: #fff; }
.ys-neden-sec .small-title,
.ys-neden-sec .intro-content p,
.ys-neden-sec .intro-content li span { color: #fff; }
.ys-neden-sec .intro-content ul { list-style: none; padding: 0; margin: 0 0 30px; }
.ys-neden-sec .intro-content ul li { display: flex; align-items: flex-start; margin-bottom: 14px; }
.ys-neden-sec .intro-content ul li i { margin: 6px 12px 0 0; flex-shrink: 0; }
.ys-neden-sec .intro-img img { width: 100%; }
@media (max-width: 767px) {
    .ys-neden-sec { padding: 60px 0; }
    .ys-neden-title { font-size: 30px; }
    .ys-neden-sec .intro-img { margin-top: 30px; }
}

/* --------------------------------------------------------------------------
   10) Uzun içerik blokları (anasayfa metni + blog yazıları)
   -------------------------------------------------------------------------- */
.ys-sec-icerik { background-color: #F8F6F4; padding: 100px 0 50px; }
.ys-icerik { line-height: 1.8; }
.ys-icerik h2 { font-size: 30px; margin: 40px 0 18px; }
.ys-icerik h3 { font-size: 23px; margin: 32px 0 14px; }
.ys-icerik h2:first-child,
.ys-icerik h3:first-child { margin-top: 0; }
.ys-icerik p { margin-bottom: 18px; }
.ys-icerik ul, .ys-icerik ol { margin: 0 0 18px 20px; }
.ys-icerik li { margin-bottom: 8px; }
.ys-icerik img { border-radius: 4px; margin: 10px 0; }
.ys-icerik blockquote {
    border-left: 3px solid #ec5598; padding: 10px 0 10px 20px;
    margin: 25px 0; font-style: italic;
}
@media (max-width: 767px) {
    .ys-sec-icerik { padding: 60px 0 30px; }
    .ys-icerik h2 { font-size: 24px; }
    .ys-icerik h3 { font-size: 20px; }
}

/* --------------------------------------------------------------------------
   11) Hizmet kartları / blog kartları
   -------------------------------------------------------------------------- */
.ys-kart-baslik { font-size: 22px; margin: 0 0 12px; }
.ys-kart-baslik a { color: inherit; }
.ys-blog-baslik { font-size: 21px; line-height: 1.4; margin-bottom: 12px; }
.ys-blog-baslik a { color: inherit; }
.blog-item { transition: transform .25s ease; }
.blog-item:hover { transform: translateY(-4px); }

/* Hizmetlerimiz sayfasındaki galeri şeridi */
.ys-galeri-serit-item { padding: 0 10px; }
.ys-galeri-serit-item img { width: 100%; display: block; border-radius: 4px; }

/* --------------------------------------------------------------------------
   12) İlgili yazılar + yazı sonu çağrı bloğu
   -------------------------------------------------------------------------- */
.ys-ilgili { margin-top: 70px; }
.ys-ilgili-baslik { font-size: 26px; margin-bottom: 30px; }
.ys-yazi-cta {
    margin-top: 50px; padding: 35px 30px;
    background: #F8F6F4; border-radius: 6px;
}
.ys-yazi-cta h2 { font-size: 24px; margin-bottom: 10px; }

/* --------------------------------------------------------------------------
   13) İletişim
   -------------------------------------------------------------------------- */
.ys-iletisim-kutu {
    background: #fff; border: 1px solid #eee; border-radius: 6px;
    padding: 35px 25px; margin-bottom: 30px; height: 100%;
}
.ys-iletisim-ikon { font-size: 34px; color: #ec5598; margin-bottom: 15px; }
.ys-iletisim-kutu h3 { font-size: 20px; margin-bottom: 12px; }
.ys-iletisim-kutu p { margin-bottom: 6px; }
.ys-iletisim-kutu a { color: inherit; }

.ys-form-satir { margin-top: 50px; }
.ys-form-kutu, .ys-form-yan { margin-bottom: 30px; }
.ys-form-baslik { font-size: 26px; margin-bottom: 20px; }
.ys-iletisim-form input,
.ys-iletisim-form textarea {
    width: 100%; border: 1px solid #e6e6e6; border-radius: 4px;
    padding: 13px 16px; margin-bottom: 18px; background: #fff;
}
.ys-iletisim-form input:focus,
.ys-iletisim-form textarea:focus { border-color: #ec5598; outline: none; }
.ys-iletisim-form button { border: none; padding: 13px 38px; cursor: pointer; }
.ys-tuzak { position: absolute; left: -9999px; opacity: 0; height: 0; overflow: hidden; }

.ys-uyari { padding: 14px 18px; border-radius: 4px; margin-bottom: 22px; }
.ys-uyari-basarili { background: #e8f6ec; color: #1d6b34; border: 1px solid #bfe3ca; }
.ys-uyari-hata { background: #fdeceb; color: #a12a22; border: 1px solid #f3c4c0; }

.ys-harita { line-height: 0; }
.ys-harita iframe { display: block; width: 100%; height: 450px; border: 0; }

/* --------------------------------------------------------------------------
   14) Arama + 404
   -------------------------------------------------------------------------- */
.ys-sonuc-sayisi { margin-bottom: 30px; color: #777; }
.ys-bos { padding: 40px 0; font-size: 17px; }
.ys-404 h2 { font-size: 90px; color: #ec5598; margin-bottom: 10px; }
.ys-404 p { margin-bottom: 25px; }

/* --------------------------------------------------------------------------
   15) Sabit arama / WhatsApp butonları (mobil)
   -------------------------------------------------------------------------- */
.call-widget, .whatsapp-widget {
    position: fixed; border-radius: 20px; padding: 10px 15px; font-size: 16px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, .2); display: none; z-index: 9999;
}
.call-widget { right: 20px; bottom: 20px; background-color: #007bff; }
.whatsapp-widget { left: 20px; bottom: 20px; background-color: #25d366; }
.call-link, .whatsapp-link { display: block; text-decoration: none; color: #fff; font-weight: 700; }
.call-link:hover, .whatsapp-link:hover { color: #fff; background-color: rgba(255, 255, 255, .1); }
.call-link:active, .whatsapp-link:active { background-color: rgba(255, 255, 255, .2); }

@media only screen and (max-width: 768px) {
    .call-widget, .whatsapp-widget { display: block; font-size: 14px; border-radius: 15px; }
}

/* --------------------------------------------------------------------------
   16) Erişilebilirlik
   -------------------------------------------------------------------------- */
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible {
    outline: 2px solid #6a1b9a; outline-offset: 2px;
}

/* ==========================================================================
   17) ORTAK BİLEŞENLER — kart, etiket, başlık
   ========================================================================== */
.ys-etiket {
    display: inline-block; color: #ec5598; font-size: 13px; font-weight: 600;
    letter-spacing: 2px; text-transform: uppercase; margin-bottom: 12px;
}
.ys-buyuk-baslik { font-size: 40px; line-height: 1.22; margin-bottom: 20px; }
@media (max-width: 767px) { .ys-buyuk-baslik { font-size: 27px; } }

/* Görselli kart (blog, hizmet, ilgili) */
.ys-kart {
    background: #fff; border: 1px solid #efe7ec; border-radius: 10px;
    overflow: hidden; margin-bottom: 30px; height: calc(100% - 30px);
    display: flex; flex-direction: column;
    transition: box-shadow .25s ease, transform .25s ease;
}
.ys-kart:hover { box-shadow: 0 14px 34px rgba(236, 85, 152, .13); transform: translateY(-4px); }
.ys-kart-gorsel { display: block; position: relative; overflow: hidden; background: #f3eef1; }
.ys-kart-gorsel img {
    width: 100%; height: 210px; object-fit: cover; display: block;
    transition: transform .5s ease;
}
.ys-kart:hover .ys-kart-gorsel img { transform: scale(1.06); }
.ys-kart-tarih {
    position: absolute; left: 14px; bottom: 14px; background: #ec5598; color: #fff;
    font-size: 12px; padding: 5px 12px; border-radius: 20px; letter-spacing: .3px;
}
.ys-kart-govde { padding: 20px 20px 22px; display: flex; flex-direction: column; flex: 1; }
.ys-kart-govde h3 { font-size: 18px; line-height: 1.4; margin: 0 0 10px; }
.ys-kart-govde h3 a { color: #232323; }
.ys-kart-govde h3 a:hover { color: #ec5598; }
.ys-kart-govde p { font-size: 14px; color: #6f6f6f; margin-bottom: 14px; flex: 1; }
.ys-kart-link { color: #ec5598; font-size: 14px; font-weight: 500; align-self: flex-start; }
.ys-kart-link i { font-size: 12px; margin-left: 5px; transition: transform .2s ease; }
.ys-kart-link:hover { color: #6a1b9a; }
.ys-kart-link:hover i { transform: translateX(4px); }

/* Liste başlığı */
.ys-liste-ust {
    display: flex; align-items: baseline; justify-content: space-between;
    border-bottom: 2px solid #f2e9ee; padding-bottom: 14px; margin-bottom: 30px;
}
.ys-liste-baslik { font-size: 26px; margin: 0; }
.ys-liste-sayi { color: #9b9b9b; font-size: 14px; }

/* ==========================================================================
   18) SAĞ SÜTUN
   ========================================================================== */
.ys-yan-sutun { padding-left: 10px; }
@media (max-width: 991px) { .ys-yan-sutun { padding-left: 0; margin-top: 50px; } }

.ys-yan-kutu {
    background: #fff; border: 1px solid #efe7ec; border-radius: 10px;
    padding: 25px 24px; margin-bottom: 30px;
}
.ys-yan-baslik {
    font-size: 19px; margin: 0 0 18px; padding-bottom: 12px;
    border-bottom: 2px solid #f2e9ee; position: relative;
}
.ys-yan-baslik::after {
    content: ''; position: absolute; left: 0; bottom: -2px;
    width: 46px; height: 2px; background: #ec5598;
}

.ys-yan-liste { list-style: none; padding: 0; margin: 0; }
.ys-yan-liste li + li { border-top: 1px dashed #eee; }
.ys-yan-liste a {
    display: flex; align-items: center; gap: 10px; padding: 11px 0;
    color: #4a4a4a; font-size: 15px;
}
.ys-yan-liste a i { font-size: 10px; color: #ec5598; transition: transform .2s ease; }
.ys-yan-liste a:hover { color: #ec5598; }
.ys-yan-liste a:hover i { transform: translateX(3px); }

.ys-yan-yazi { list-style: none; padding: 0; margin: 0; }
.ys-yan-yazi li + li { margin-top: 16px; padding-top: 16px; border-top: 1px dashed #eee; }
.ys-yan-yazi a { display: flex; gap: 13px; align-items: flex-start; }
.ys-yan-gorsel { flex: 0 0 72px; }
.ys-yan-gorsel img { width: 72px; height: 58px; object-fit: cover; border-radius: 6px; display: block; }
.ys-yan-metin { display: block; }
.ys-yan-yazi-baslik {
    display: block; font-size: 14px; line-height: 1.45; color: #333; font-weight: 500;
}
.ys-yan-yazi a:hover .ys-yan-yazi-baslik { color: #ec5598; }
.ys-yan-tarih { display: block; font-size: 12px; color: #a0a0a0; margin-top: 4px; }

.ys-yan-konum p { font-size: 14px; color: #6f6f6f; line-height: 1.7; }
.ys-yan-konum p i { color: #ec5598; margin-right: 6px; }
.ys-yan-link { color: #ec5598; font-size: 14px; font-weight: 500; }
.ys-yan-link i { font-size: 12px; margin-left: 5px; }
.ys-yan-link:hover { color: #6a1b9a; }

/* ==========================================================================
   19) CTA KUTULARI
   ========================================================================== */
.ys-cta-kutu {
    border-radius: 10px; padding: 30px 24px 28px; margin-bottom: 30px;
    text-align: center; color: #fff;
}
.ys-cta-pembe { background: linear-gradient(150deg, #ec5598 0%, #d33f80 100%); }
.ys-cta-koyu { background: linear-gradient(150deg, #6a1b9a 0%, #4a1170 100%); }
.ys-cta-ikon {
    width: 58px; height: 58px; line-height: 58px; border-radius: 50%;
    background: rgba(255, 255, 255, .18); margin: 0 auto 16px; font-size: 22px;
}
.ys-cta-kutu h3 { color: #fff; font-size: 21px; margin-bottom: 10px; }
.ys-cta-kutu p { font-size: 14px; opacity: .9; margin-bottom: 20px; line-height: 1.65; }
.ys-cta-btn {
    display: block; background: #fff; color: #d33f80; font-weight: 600;
    padding: 13px 18px; border-radius: 30px; margin-bottom: 10px; font-size: 15px;
    white-space: nowrap;
}
.ys-cta-btn:hover { background: #232323; color: #fff; }
.ys-cta-btn-wa { background: #25d366; color: #fff; }
.ys-cta-btn-wa:hover { background: #1da851; color: #fff; }
.ys-cta-btn-acik { background: rgba(255, 255, 255, .16); color: #fff; border: 1px solid rgba(255, 255, 255, .4); }
.ys-cta-btn-acik:hover { background: #fff; color: #6a1b9a; }
.ys-cta-saat { display: block; font-size: 13px; opacity: .82; margin-top: 6px; }
.ys-cta-saat i { margin-right: 5px; }

/* ==========================================================================
   20) YAZI / HİZMET DETAY
   ========================================================================== */
.ys-detay { padding-top: 80px; }
.ys-yazi-gorsel { border-radius: 12px; overflow: hidden; margin-bottom: 24px; }
.ys-yazi-gorsel img { width: 100%; height: 400px; object-fit: cover; display: block; }
@media (max-width: 767px) { .ys-yazi-gorsel img { height: 220px; } }

.ys-yazi-meta {
    display: flex; gap: 22px; flex-wrap: wrap; color: #8d8d8d; font-size: 14px;
    padding-bottom: 18px; margin-bottom: 24px; border-bottom: 1px solid #f0e9ed;
}
.ys-yazi-meta i { color: #ec5598; margin-right: 6px; }

.ys-yazi-cta {
    margin-top: 45px; padding: 28px 30px; border-radius: 12px;
    background: #F8F6F4; border: 1px solid #efe7ec;
    display: flex; align-items: center; justify-content: space-between;
    gap: 20px; flex-wrap: wrap;
}
.ys-yazi-cta h2 { font-size: 22px; margin-bottom: 6px; }
.ys-yazi-cta p { font-size: 14px; color: #6f6f6f; margin: 0; max-width: 420px; }
.ys-yazi-cta-btn { display: flex; gap: 10px; flex-wrap: wrap; }
.ys-yazi-cta-btn a { white-space: nowrap; }

/* ==========================================================================
   21) HİZMETLER LİSTESİ (satır düzeni)
   ========================================================================== */
.ys-hizmet-satir {
    display: flex; gap: 22px; background: #fff; border: 1px solid #efe7ec;
    border-radius: 12px; padding: 18px; margin-bottom: 24px;
    transition: box-shadow .25s ease;
}
.ys-hizmet-satir:hover { box-shadow: 0 14px 34px rgba(236, 85, 152, .12); }
.ys-hizmet-gorsel { flex: 0 0 210px; border-radius: 9px; overflow: hidden; }
.ys-hizmet-gorsel img { width: 100%; height: 160px; object-fit: cover; display: block; }
.ys-hizmet-metin { flex: 1; }
.ys-hizmet-metin h3 { font-size: 21px; margin: 4px 0 10px; }
.ys-hizmet-metin h3 a { color: #232323; }
.ys-hizmet-metin h3 a:hover { color: #ec5598; }
.ys-hizmet-metin p { font-size: 14.5px; color: #6f6f6f; margin-bottom: 14px; }
.ys-hizmet-btn { display: flex; gap: 18px; align-items: center; flex-wrap: wrap; }
.ys-hizmet-tel { font-size: 14px; color: #6a1b9a; font-weight: 500; }
.ys-hizmet-tel i { font-size: 12px; margin-right: 5px; }
.ys-hizmet-tel:hover { color: #ec5598; }
@media (max-width: 575px) {
    .ys-hizmet-satir { flex-direction: column; }
    .ys-hizmet-gorsel { flex: none; }
}
.ys-serit-kutu {
    background: #fff; border: 1px solid #efe7ec; border-radius: 12px;
    padding: 24px; margin-top: 10px;
}

/* ==========================================================================
   22) PAKET KARTLARI
   ========================================================================== */
.ys-paket-satir { margin-top: 45px; }
.ys-paket {
    position: relative; background: #fff; border: 1px solid #eee2ea;
    border-radius: 14px; padding: 34px 28px 28px; margin-bottom: 30px;
    height: calc(100% - 30px); display: flex; flex-direction: column;
    transition: box-shadow .3s ease, transform .3s ease, border-color .3s ease;
}
.ys-paket:hover {
    box-shadow: 0 18px 44px rgba(236, 85, 152, .16);
    transform: translateY(-5px); border-color: #f6d3e4;
}
.ys-paket-populer { border-color: #ec5598; box-shadow: 0 14px 36px rgba(236, 85, 152, .16); }
.ys-paket-rozet {
    position: absolute; top: -13px; left: 50%; transform: translateX(-50%);
    background: #ec5598; color: #fff; font-size: 11.5px; font-weight: 600;
    letter-spacing: .6px; text-transform: uppercase; padding: 6px 16px;
    border-radius: 20px; white-space: nowrap;
}
.ys-paket-no {
    display: block; font-family: 'Domine', serif; font-size: 34px;
    color: #f2dbe7; line-height: 1; margin-bottom: 8px;
}
.ys-paket-populer .ys-paket-no { color: #f7c2dc; }
.ys-paket-ad { font-size: 23px; margin: 0 0 10px; }
.ys-paket-aciklama { font-size: 14px; color: #7a7a7a; line-height: 1.65; margin-bottom: 20px; }
.ys-paket-ozellik { list-style: none; padding: 0; margin: 0 0 24px; flex: 1; }
.ys-paket-ozellik li {
    display: flex; align-items: flex-start; gap: 11px;
    padding: 9px 0; border-bottom: 1px dashed #f0eaee; font-size: 15px; color: #4a4a4a;
}
.ys-paket-ozellik li:last-child { border-bottom: 0; }
.ys-paket-ozellik i {
    color: #ec5598; font-size: 12px; margin-top: 5px; flex-shrink: 0;
    background: #fdeff6; width: 20px; height: 20px; line-height: 20px;
    text-align: center; border-radius: 50%;
}
.ys-paket-alt { border-top: 1px solid #f2e9ee; padding-top: 20px; }
.ys-paket-fiyat { display: block; font-size: 26px; color: #232323; font-weight: 600; margin-bottom: 14px; }
.ys-paket-fiyat-yok { display: block; font-size: 13.5px; color: #9b9b9b; margin-bottom: 14px; }
.ys-paket-btn {
    display: block; text-align: center; background: #ec5598; color: #fff;
    font-weight: 600; padding: 14px 20px; border-radius: 30px;
    white-space: nowrap; letter-spacing: .3px;
}
.ys-paket-btn:hover { background: #6a1b9a; color: #fff; }
.ys-paket-populer .ys-paket-btn { background: #6a1b9a; }
.ys-paket-populer .ys-paket-btn:hover { background: #ec5598; }

.ys-paket-incele {
    display: inline-block; background: #fff; border: 2px solid #ec5598;
    color: #ec5598; font-weight: 600; padding: 13px 28px; border-radius: 30px;
    white-space: nowrap; letter-spacing: .3px;
}
.ys-paket-incele i { font-size: 12px; margin-left: 7px; transition: transform .2s ease; }
.ys-paket-incele:hover { background: #ec5598; color: #fff; }
.ys-paket-incele:hover i { transform: translateX(4px); }
@media (max-width: 767px) {
    .ys-paket-incele { margin-top: 18px; }
    .col-md-6.text-right, .col-sm-12.text-right { text-align: left !important; }
}

/* ==========================================================================
   23) PAKETLER SAYFASI
   ========================================================================== */
.ys-paket-giris { padding: 80px 0 20px; background: #FBF7F9; }
.ys-giris-metin { font-size: 16px; color: #6f6f6f; line-height: 1.85; margin-bottom: 24px; }
.ys-giris-rozet { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }
.ys-giris-rozet span {
    background: #fff; border: 1px solid #f0e2ea; border-radius: 30px;
    padding: 9px 18px; font-size: 14px; color: #555;
}
.ys-giris-rozet i { color: #ec5598; margin-right: 7px; }
.ys-paket-liste { padding: 55px 0 30px; background: #FBF7F9; }

.ys-paket-tablo-bolum { padding: 80px 0 70px; }
.ys-tablo-sar { overflow-x: auto; margin-top: 40px; }
.ys-paket-tablo { width: 100%; border-collapse: collapse; min-width: 720px; }
.ys-paket-tablo th, .ys-paket-tablo td {
    padding: 15px 14px; text-align: center; border-bottom: 1px solid #f0eaee;
}
.ys-paket-tablo thead th {
    background: #6a1b9a; color: #fff; font-size: 14.5px; font-weight: 600;
    border-bottom: 0;
}
.ys-paket-tablo thead th:first-child { text-align: left; border-radius: 10px 0 0 0; }
.ys-paket-tablo thead th:last-child { border-radius: 0 10px 0 0; }
.ys-paket-tablo thead th.ys-vurgu { background: #ec5598; }
.ys-tablo-ad { text-align: left !important; font-weight: 500; color: #333; }
.ys-paket-tablo td.ys-vurgu { background: #fdf3f8; }
.ys-var { color: #ec5598; }
.ys-yok { color: #d4d4d4; }
.ys-tablo-not { margin-top: 22px; font-size: 14px; color: #8d8d8d; text-align: center; }

.ys-paket-cta { padding: 0 0 90px; }
.ys-cta-kart {
    background: linear-gradient(150deg, #ec5598 0%, #d33f80 100%); color: #fff;
    border-radius: 14px; padding: 34px 28px; text-align: center; margin-bottom: 30px;
    height: calc(100% - 30px);
}
.ys-cta-kart-yesil { background: linear-gradient(150deg, #2ed06b 0%, #17a34c 100%); }
.ys-cta-kart-mor { background: linear-gradient(150deg, #6a1b9a 0%, #4a1170 100%); }
.ys-cta-kart-ikon {
    width: 62px; height: 62px; line-height: 62px; border-radius: 50%;
    background: rgba(255, 255, 255, .18); margin: 0 auto 16px; font-size: 24px;
}
.ys-cta-kart h3 { color: #fff; font-size: 22px; margin-bottom: 10px; }
.ys-cta-kart p { font-size: 14.5px; opacity: .92; margin-bottom: 22px; line-height: 1.65; }
.ys-cta-kart-btn {
    display: inline-block; background: #fff; color: #232323; font-weight: 600;
    padding: 13px 26px; border-radius: 30px; white-space: nowrap;
}
.ys-cta-kart-btn:hover { background: #232323; color: #fff; }

/* ==========================================================================
   24) HAKKIMIZDA
   ========================================================================== */
.ys-hakkinda-giris { padding: 90px 0 70px; }
.ys-hakkinda-gorsel { position: relative; padding: 0 0 60px 0; }
.ys-hg-buyuk { width: 88%; border-radius: 14px; display: block; }
.ys-hg-kucuk {
    position: absolute; right: 0; bottom: 0; width: 52%;
    border: 8px solid #fff; border-radius: 14px;
    box-shadow: 0 14px 34px rgba(0, 0, 0, .12);
}
.ys-hg-rozet {
    position: absolute; left: 0; bottom: 78px; background: #ec5598; color: #fff;
    border-radius: 12px; padding: 16px 20px; text-align: center; line-height: 1.15;
    box-shadow: 0 12px 28px rgba(236, 85, 152, .32);
}
.ys-hg-rozet strong { display: block; font-size: 26px; font-family: 'Domine', serif; }
.ys-hg-rozet span { font-size: 12.5px; opacity: .9; }
.ys-hakkinda-metin p { color: #6f6f6f; line-height: 1.85; margin-bottom: 16px; }
.ys-hakkinda-btn { margin-top: 26px; display: flex; gap: 12px; flex-wrap: wrap; }
.ys-hakkinda-btn a { white-space: nowrap; }
@media (max-width: 991px) { .ys-hakkinda-metin { margin-top: 45px; } }

.ys-degerler { padding: 80px 0 50px; background: #F8F6F4; }
.ys-deger {
    background: #fff; border-radius: 12px; padding: 32px 26px; text-align: center;
    margin-bottom: 30px; height: calc(100% - 30px);
    transition: transform .25s ease, box-shadow .25s ease;
}
.ys-deger:hover { transform: translateY(-5px); box-shadow: 0 16px 36px rgba(0, 0, 0, .08); }
.ys-deger-ikon {
    width: 66px; height: 66px; line-height: 66px; border-radius: 50%;
    background: #fdeff6; color: #ec5598; font-size: 24px; margin: 0 auto 18px;
}
.ys-deger h3 { font-size: 18px; margin-bottom: 10px; }
.ys-deger p { font-size: 14px; color: #737373; line-height: 1.7; }

.ys-hakkinda-hizmet { padding: 80px 0 50px; }
.ys-hakkinda-hizmet .section-title,
.ys-degerler .section-title,
.ys-paket-tablo-bolum .section-title { margin-bottom: 45px; }

.ys-genis-cta { padding: 40px 0 90px; }
.ys-genis-cta-ic {
    background: linear-gradient(120deg, #6a1b9a 0%, #ec5598 100%); color: #fff;
    border-radius: 16px; padding: 45px 45px; display: flex; align-items: center;
    justify-content: space-between; gap: 26px; flex-wrap: wrap;
}
.ys-genis-cta-metin h2 { color: #fff; font-size: 30px; margin-bottom: 8px; }
.ys-genis-cta-metin p { margin: 0; opacity: .92; max-width: 560px; color: #fff; }
.ys-genis-cta-btn { display: flex; gap: 12px; flex-wrap: wrap; }
.ys-genis-cta-btn a { white-space: nowrap; }
.ys-wa-btn {
    display: inline-block; background: #25d366; color: #fff; font-weight: 600;
    padding: 15px 30px; border-radius: 30px;
}
.ys-wa-btn:hover { background: #1da851; color: #fff; }
@media (max-width: 767px) {
    .ys-genis-cta-ic { padding: 32px 24px; }
    .ys-genis-cta-metin h2 { font-size: 23px; }
}

/* ==========================================================================
   25) İLETİŞİM
   ========================================================================== */
.ys-iletisim-ust { padding: 80px 0 20px; }
.ys-il-kart {
    background: #fff; border: 1px solid #efe7ec; border-radius: 12px;
    padding: 30px 24px; text-align: center; margin-bottom: 30px;
    height: calc(100% - 30px); transition: transform .25s ease, box-shadow .25s ease;
}
.ys-il-kart:hover { transform: translateY(-5px); box-shadow: 0 16px 36px rgba(236, 85, 152, .13); }
.ys-il-ikon {
    width: 62px; height: 62px; line-height: 62px; border-radius: 50%;
    background: #fdeff6; color: #ec5598; font-size: 22px; margin: 0 auto 16px;
}
.ys-il-kart h3 { font-size: 18px; margin-bottom: 12px; }
.ys-il-kart a { display: block; color: #4a4a4a; font-size: 15px; margin-bottom: 4px; }
.ys-il-kart a:hover { color: #ec5598; }
.ys-il-kart span { display: block; font-size: 13px; color: #a0a0a0; margin-top: 6px; }
.ys-il-duz { cursor: default; }

.ys-iletisim-form-bolum { padding: 40px 0 80px; }
.ys-form-kutu {
    background: #fff; border: 1px solid #efe7ec; border-radius: 14px;
    padding: 40px 38px; margin-bottom: 30px;
}
.ys-form-alt { color: #6f6f6f; font-size: 15px; margin-bottom: 26px; }
.ys-iletisim-form label {
    display: block; font-size: 13.5px; color: #555; font-weight: 500; margin-bottom: 7px;
}
.ys-iletisim-form input,
.ys-iletisim-form textarea {
    width: 100%; border: 1px solid #e6e6e6; border-radius: 8px;
    padding: 13px 16px; margin-bottom: 18px; background: #fbfbfb;
    transition: border-color .2s ease, background .2s ease;
}
.ys-iletisim-form input:focus,
.ys-iletisim-form textarea:focus { border-color: #ec5598; background: #fff; outline: none; }
.ys-form-btn {
    background: #ec5598; color: #fff; border: 0; font-weight: 600;
    padding: 15px 38px; border-radius: 30px; cursor: pointer; white-space: nowrap;
    transition: background .25s ease;
}
.ys-form-btn i { font-size: 12px; margin-left: 8px; }
.ys-form-btn:hover { background: #6a1b9a; }

.ys-il-yan { padding-left: 10px; }
@media (max-width: 991px) { .ys-il-yan { padding-left: 0; } }
.ys-il-adres {
    background: #F8F6F4; border-radius: 12px; padding: 28px 26px; margin-bottom: 30px;
}
.ys-il-adres h3 { font-size: 19px; margin-bottom: 12px; }
.ys-il-adres h3 i { color: #ec5598; margin-right: 8px; }
.ys-il-adres p { font-size: 14.5px; color: #6f6f6f; line-height: 1.75; margin-bottom: 14px; }
@media (max-width: 575px) { .ys-form-kutu { padding: 28px 22px; } }

/* ==========================================================================
   26) MASAJ ÇEŞİTLERİ + ALT BİLGİ YAPIMCI
   ========================================================================== */
.ys-masaj-bolum { padding: 80px 0 40px; }
.ys-masaj-bolum .section-title { margin-bottom: 45px; }
.ys-masaj-kart {
    background: #fff; border: 1px solid #efe7ec; border-radius: 12px;
    padding: 26px 22px; margin-bottom: 30px; height: calc(100% - 30px);
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.ys-masaj-kart:hover {
    transform: translateY(-4px); border-color: #f6d3e4;
    box-shadow: 0 14px 32px rgba(236, 85, 152, .13);
}
.ys-masaj-sure {
    display: inline-block; background: #fdeff6; color: #ec5598;
    font-size: 12.5px; font-weight: 600; padding: 5px 13px;
    border-radius: 20px; margin-bottom: 12px; letter-spacing: .3px;
}
.ys-masaj-kart h3 { font-size: 17px; line-height: 1.4; margin-bottom: 9px; }
.ys-masaj-kart p { font-size: 13.5px; color: #7a7a7a; line-height: 1.65; margin: 0; }

/* Alt bilgideki yapımcı imzası */
.ys-yapimci { display: inline-block; margin-left: 16px; vertical-align: middle; }
@media (max-width: 767px) {
    .ys-yapimci { display: block; margin: 12px 0 0; }
}

/* ==========================================================================
   30) RENKLİ ZEMİNLERDE OKUNABİLİRLİK
   Not: Temanın genel "p { color:#555 }" kuralı, renkli kutulardaki
   paragrafları da griye çeviriyordu. Aşağıdaki kurallar bunu düzeltir.
   ========================================================================== */
.ys-cta-kutu, .ys-cta-kutu p, .ys-cta-kutu span, .ys-cta-kutu li, .ys-cta-kutu a.ys-cta-btn-acik,
.ys-cta-kart, .ys-cta-kart p, .ys-cta-kart span, .ys-cta-kart li,
.ys-galeri-cta-kutu, .ys-galeri-cta-kutu p, .ys-galeri-cta-kutu h2,
.ys-paket-cta .ys-cta-kart p,
.ys-il-cta, .ys-il-cta p, .ys-il-cta span, .ys-il-cta h3,
.ys-harita-serit, .ys-harita-serit p, .ys-harita-serit h3,
.ys-genis-cta-ic, .ys-genis-cta-metin, .ys-genis-cta-metin p, .ys-genis-cta-metin h2 { color: #fff; }

.ys-cta-kutu p, .ys-cta-kart p { opacity: .95; }

/* Pembe / mor zeminli tema bileşenleri */
.pink-btn, .pink-btn:hover, .blue-btn, .theme-btn,
.appointment-area .appointment-content h2,
.subscribe-area h2, .subscribe-area p { color: #fff; }

/* ==========================================================================
   31) GALERİ SAYFASI
   ========================================================================== */
.ys-galeri-bolum { padding: 90px 0 100px; }
.ys-galeri-giris { max-width: 720px; margin: 18px auto 0; color: #6f6f6f; line-height: 1.75; }

.ys-galeri-izgara {
    display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin-top: 50px;
}
@media (max-width: 1199px) { .ys-galeri-izgara { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 767px)  { .ys-galeri-izgara { grid-template-columns: repeat(2, 1fr); gap: 14px; } }
@media (max-width: 479px)  { .ys-galeri-izgara { grid-template-columns: 1fr; } }

.ys-galeri-oge {
    position: relative; display: block; width: 100%; aspect-ratio: 4 / 3;
    padding: 0; border: 0; border-radius: 12px; overflow: hidden; cursor: pointer;
    background: #f3f0ee; box-shadow: 0 8px 22px rgba(0, 0, 0, .07);
    transition: transform .25s ease, box-shadow .25s ease;
}
.ys-galeri-oge:hover { transform: translateY(-4px); box-shadow: 0 16px 34px rgba(0, 0, 0, .14); }
.ys-galeri-oge img, .ys-galeri-oge video {
    width: 100%; height: 100%; object-fit: cover; display: block;
}
.ys-galeri-video { background: #1c1524; }
.ys-galeri-oge::after {
    content: ''; position: absolute; inset: 0; background: rgba(236, 85, 152, 0);
    transition: background .25s ease;
}
.ys-galeri-oge:hover::after { background: rgba(236, 85, 152, .18); }
.ys-galeri-play {
    position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
    width: 60px; height: 60px; line-height: 60px; border-radius: 50%;
    background: rgba(255, 255, 255, .9); color: #ec5598; font-size: 20px;
    text-align: center; z-index: 2; padding-left: 4px;
}

/* Işık kutusu */
.ys-lb {
    position: fixed; inset: 0; z-index: 9999; background: rgba(16, 12, 24, .95);
    display: none; align-items: center; justify-content: center;
    touch-action: pan-y;
}
.ys-lb.acik { display: flex; }
body.ys-lb-kilit { overflow: hidden; }
.ys-lb-sahne {
    max-width: 92vw; max-height: 86vh; display: flex; align-items: center; justify-content: center;
}
.ys-lb-sahne img, .ys-lb-sahne video {
    max-width: 92vw; max-height: 86vh; width: auto; height: auto; display: block;
    border-radius: 6px; box-shadow: 0 20px 60px rgba(0, 0, 0, .55);
}
.ys-lb-kapat, .ys-lb-ok {
    position: absolute; border: 0; cursor: pointer; color: #fff;
    background: rgba(255, 255, 255, .14); border-radius: 50%;
    width: 48px; height: 48px; font-size: 18px; line-height: 48px; padding: 0;
    transition: background .2s ease;
}
.ys-lb-kapat:hover, .ys-lb-ok:hover { background: #ec5598; }
.ys-lb-kapat { top: 22px; right: 22px; }
.ys-lb-onceki { left: 22px; top: 50%; transform: translateY(-50%); }
.ys-lb-sonraki { right: 22px; top: 50%; transform: translateY(-50%); }
.ys-lb-sayac {
    position: absolute; bottom: 20px; left: 50%; transform: translateX(-50%);
    color: rgba(255, 255, 255, .8); font-size: 14px; letter-spacing: .04em;
}
@media (max-width: 767px) {
    .ys-lb-kapat { top: 12px; right: 12px; width: 42px; height: 42px; line-height: 42px; }
    .ys-lb-onceki { left: 8px; }
    .ys-lb-sonraki { right: 8px; }
    .ys-lb-ok { width: 42px; height: 42px; line-height: 42px; }
}

/* Galeri alt CTA */
.ys-galeri-cta { padding: 0 0 100px; }
.ys-galeri-cta-kutu {
    background: linear-gradient(135deg, #6a1b9a 0%, #ec5598 100%);
    border-radius: 18px; padding: 54px 30px; text-align: center;
}
.ys-galeri-cta-kutu h2 { font-size: 32px; margin-bottom: 12px; }
.ys-galeri-cta-kutu p { margin-bottom: 26px; opacity: .95; }
.ys-galeri-cta-btnler { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; }
.ys-btn-pembe, .ys-btn-yesil {
    display: inline-block; padding: 14px 30px; border-radius: 30px; font-weight: 600;
    background: #fff; color: #6a1b9a;
}
.ys-btn-pembe:hover { background: #232323; color: #fff; }
.ys-btn-yesil { background: #25d366; color: #fff; }
.ys-btn-yesil:hover { background: #1da851; color: #fff; }

/* ==========================================================================
   32) PAKETLER — masaj panosu, program ızgarası, Gold kartı
   ========================================================================== */
.ys-masaj-pano {
    display: grid; grid-template-columns: repeat(2, 1fr); gap: 26px; margin-top: 45px;
}
@media (max-width: 767px) { .ys-masaj-pano { grid-template-columns: 1fr; } }

.ys-masaj-sutun {
    background: #fff; border: 1px solid #f0e7de; border-radius: 14px;
    padding: 30px 28px 24px; box-shadow: 0 10px 26px rgba(0, 0, 0, .05);
}
.ys-masaj-sure-baslik {
    font-size: 18px; letter-spacing: .08em; color: #ec5598;
    margin: 0 0 18px; padding-bottom: 14px; border-bottom: 2px solid #f6e5ee;
}
.ys-masaj-liste { list-style: none; margin: 0; padding: 0; }
.ys-masaj-liste li { padding: 13px 0; border-bottom: 1px dashed #eee; }
.ys-masaj-liste li:last-child { border-bottom: 0; }
.ys-masaj-ad { display: block; font-weight: 600; color: #232323; font-size: 16px; }
.ys-masaj-not { display: block; font-size: 13.5px; color: #7b7b7b; margin-top: 4px; line-height: 1.6; }

.ys-program-bolum { background: #faf7f4; }
.ys-program-izgara {
    display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; margin-top: 45px;
}
@media (max-width: 1199px) { .ys-program-izgara { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 991px)  { .ys-program-izgara { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 575px)  { .ys-program-izgara { grid-template-columns: 1fr; } }

.ys-program-kart {
    position: relative; background: #fff; border-radius: 14px; padding: 32px 26px 28px;
    border: 1px solid #f0e7de; box-shadow: 0 10px 26px rgba(0, 0, 0, .05);
    display: flex; flex-direction: column; transition: transform .25s ease, box-shadow .25s ease;
}
.ys-program-kart:hover { transform: translateY(-5px); box-shadow: 0 18px 40px rgba(0, 0, 0, .1); }
.ys-program-no {
    font-family: 'Domine', serif; font-size: 34px; line-height: 1;
    color: #f6d3e4; display: block; margin-bottom: 6px;
}
.ys-program-ad { font-size: 21px; margin: 0 0 10px; color: #232323; }
.ys-program-aciklama { font-size: 14px; color: #7b7b7b; line-height: 1.65; margin-bottom: 16px; }
.ys-program-ozellik { list-style: none; margin: 0 0 22px; padding: 0; flex: 1 1 auto; }
.ys-program-ozellik li {
    display: flex; gap: 10px; align-items: flex-start;
    font-size: 14.5px; color: #4a4a4a; padding: 8px 0; border-bottom: 1px dashed #f0f0f0;
}
.ys-program-ozellik li:last-child { border-bottom: 0; }
.ys-program-ozellik i { color: #ec5598; font-size: 12px; margin-top: 4px; }
.ys-program-btn {
    display: block; text-align: center; background: #ec5598; color: #fff;
    font-weight: 600; padding: 12px 18px; border-radius: 30px; font-size: 15px;
}
.ys-program-btn:hover { background: #6a1b9a; color: #fff; }

/* Gold */
.ys-gold-bolum { padding: 90px 0 100px; }
.ys-gold-kart {
    display: grid; grid-template-columns: 1.1fr 1fr; gap: 40px; align-items: center;
    background: linear-gradient(135deg, #2b2118 0%, #4a3721 55%, #7a5c2b 100%);
    border: 2px solid #d9b56a; border-radius: 20px; padding: 52px 46px;
    box-shadow: 0 22px 50px rgba(0, 0, 0, .18);
}
@media (max-width: 991px) { .ys-gold-kart { grid-template-columns: 1fr; gap: 26px; padding: 40px 26px; } }
.ys-gold-rozet {
    display: inline-block; background: rgba(217, 181, 106, .18); color: #f0d49a;
    border: 1px solid rgba(217, 181, 106, .5); border-radius: 30px;
    padding: 6px 16px; font-size: 12.5px; letter-spacing: .08em; text-transform: uppercase;
}
.ys-gold-ad {
    font-size: 44px; color: #e9c87f; margin: 16px 0 12px; letter-spacing: .04em;
}
.ys-gold-aciklama { color: #efe4d2; font-size: 15.5px; line-height: 1.75; margin-bottom: 26px; }
.ys-gold-btnler { display: flex; gap: 12px; flex-wrap: wrap; }
.ys-gold-btn {
    display: inline-block; background: #e9c87f; color: #2b2118; font-weight: 600;
    padding: 13px 26px; border-radius: 30px; white-space: nowrap;
}
.ys-gold-btn:hover { background: #fff; color: #2b2118; }
.ys-gold-btn-wa { background: #25d366; color: #fff; }
.ys-gold-btn-wa:hover { background: #1da851; color: #fff; }
.ys-gold-ozellik { list-style: none; margin: 0; padding: 0; }
.ys-gold-ozellik li {
    display: flex; gap: 12px; align-items: flex-start; color: #f6efe2;
    font-size: 16px; padding: 12px 0; border-bottom: 1px solid rgba(233, 200, 127, .22);
}
.ys-gold-ozellik li:last-child { border-bottom: 0; }
.ys-gold-ozellik i { color: #e9c87f; font-size: 13px; margin-top: 5px; }

/* ==========================================================================
   33) İLETİŞİM — yenilenen bilgi kartları ve harita bölümü
   ========================================================================== */
.ys-iletisim-ust { padding: 80px 0 20px; }
.ys-il-kart {
    background: #fff; border: 1px solid #f0e7de; border-radius: 14px;
    padding: 32px 22px 28px; text-align: center; margin-bottom: 30px; height: calc(100% - 30px);
    box-shadow: 0 10px 26px rgba(0, 0, 0, .05);
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.ys-il-kart:hover {
    transform: translateY(-5px); border-color: #f3cede;
    box-shadow: 0 18px 40px rgba(236, 85, 152, .13);
}
.ys-il-ikon {
    width: 62px; height: 62px; line-height: 62px; border-radius: 50%;
    margin: 0 auto 16px; font-size: 23px; color: #ec5598;
    background: linear-gradient(150deg, #fdeaf3 0%, #f7dcea 100%);
}
.ys-il-kart h3 { font-size: 19px; margin-bottom: 10px; color: #232323; }
.ys-il-kart a { display: block; color: #4a4a4a; font-size: 15px; line-height: 1.7; }
.ys-il-kart a:hover { color: #ec5598; }
.ys-il-kart span { display: block; font-size: 13px; color: #9a9a9a; margin-top: 6px; }

.ys-harita-bolum { padding: 40px 0 100px; }
.ys-harita-kart {
    margin-top: 45px; border-radius: 18px; overflow: hidden;
    border: 1px solid #f0e7de; box-shadow: 0 16px 40px rgba(0, 0, 0, .09); line-height: 0;
}
.ys-harita-kart iframe { display: block; width: 100%; border: 0; }

.ys-harita-serit {
    margin-top: -1px; display: flex; flex-wrap: wrap; gap: 22px;
    align-items: center; justify-content: space-between;
    background: linear-gradient(135deg, #6a1b9a 0%, #ec5598 100%);
    border-radius: 0 0 18px 18px; padding: 28px 34px;
    box-shadow: 0 16px 40px rgba(0, 0, 0, .09);
}
.ys-harita-serit h3 { font-size: 20px; margin: 0 0 6px; }
.ys-harita-serit h3 i { margin-right: 8px; }
.ys-harita-serit p { margin: 0; font-size: 14.5px; opacity: .95; max-width: 560px; line-height: 1.65; }
.ys-harita-serit-btnler { display: flex; gap: 12px; flex-wrap: wrap; }
.ys-harita-btn {
    display: inline-block; background: #fff; color: #6a1b9a; font-weight: 600;
    padding: 13px 24px; border-radius: 30px; white-space: nowrap; font-size: 15px;
}
.ys-harita-btn:hover { background: #232323; color: #fff; }
.ys-harita-btn-acik {
    background: rgba(255, 255, 255, .16); color: #fff; border: 1px solid rgba(255, 255, 255, .45);
}
.ys-harita-btn-acik:hover { background: #fff; color: #6a1b9a; }
@media (max-width: 767px) {
    .ys-harita-serit { padding: 24px 20px; border-radius: 0 0 14px 14px; }
    .ys-harita-serit-btnler { width: 100%; }
    .ys-harita-btn { flex: 1 1 auto; text-align: center; }
}

/* ==========================================================================
   34) ANASAYFA — "Neler Yapıyoruz" kutuları ve hizmet kartları (yeni tasarım)
   ========================================================================== */
.ys-nk {
    position: relative; background: #fff; border-radius: 16px;
    padding: 42px 30px 34px; margin-bottom: 30px; height: calc(100% - 30px);
    border: 1px solid #f2eae2; overflow: hidden;
    box-shadow: 0 10px 30px rgba(0, 0, 0, .05);
    transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.ys-nk::before {
    content: ''; position: absolute; left: 0; top: 0; right: 0; height: 4px;
    background: linear-gradient(90deg, #ec5598 0%, #6a1b9a 100%);
    transform: scaleX(0); transform-origin: left; transition: transform .35s ease;
}
.ys-nk:hover { transform: translateY(-7px); border-color: #f3cede; box-shadow: 0 22px 46px rgba(236, 85, 152, .16); }
.ys-nk:hover::before { transform: scaleX(1); }
.ys-nk-no {
    position: absolute; right: 24px; top: 20px; font-family: 'Domine', serif;
    font-size: 46px; line-height: 1; color: #f7e7ef; pointer-events: none;
}
.ys-nk-ikon {
    width: 68px; height: 68px; line-height: 68px; border-radius: 20px;
    background: linear-gradient(150deg, #fdeaf3 0%, #f3dcf0 100%);
    color: #ec5598; font-size: 26px; text-align: center; margin-bottom: 22px;
    transition: background .3s ease, color .3s ease, transform .3s ease;
}
.ys-nk:hover .ys-nk-ikon {
    background: linear-gradient(150deg, #ec5598 0%, #6a1b9a 100%); color: #fff; transform: rotate(-6deg);
}
.ys-nk-baslik { font-size: 23px; margin-bottom: 12px; }
.ys-nk-baslik a { color: #232323; }
.ys-nk-baslik a:hover { color: #ec5598; }
.ys-nk p { font-size: 15px; color: #6f6f6f; line-height: 1.75; margin-bottom: 20px; }
.ys-nk-link { font-weight: 600; color: #ec5598; font-size: 15px; }
.ys-nk-link i { font-size: 12px; margin-left: 6px; transition: transform .25s ease; }
.ys-nk-link:hover { color: #6a1b9a; }
.ys-nk:hover .ys-nk-link i { transform: translateX(5px); }

/* Görselli hizmet kartları */
.ys-hk {
    background: #fff; border-radius: 16px; overflow: hidden; margin-bottom: 40px;
    border: 1px solid #f2eae2; box-shadow: 0 10px 30px rgba(0, 0, 0, .05);
    transition: transform .3s ease, box-shadow .3s ease;
}
.ys-hk:hover { transform: translateY(-7px); box-shadow: 0 24px 50px rgba(0, 0, 0, .13); }
.ys-hk-gorsel { position: relative; display: block; overflow: hidden; line-height: 0; }
.ys-hk-gorsel img {
    width: 100%; height: 250px; object-fit: cover; display: block;
    transition: transform .6s ease;
}
.ys-hk:hover .ys-hk-gorsel img { transform: scale(1.07); }
.ys-hk-gorsel::after {
    content: ''; position: absolute; inset: 0;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 45%, rgba(35, 20, 40, .45) 100%);
}
.ys-hk-ikon {
    position: absolute; left: 50%; bottom: -30px; transform: translateX(-50%);
    width: 68px; height: 68px; border-radius: 50%; background: #fff; z-index: 2;
    display: flex; align-items: center; justify-content: center;
    box-shadow: 0 8px 22px rgba(0, 0, 0, .14);
    transition: background .3s ease;
}
.ys-hk-ikon img { width: 34px; height: auto; }
.ys-hk-govde { padding: 48px 26px 30px; text-align: center; }
.ys-hk-govde h3 { font-size: 22px; margin-bottom: 12px; }
.ys-hk-govde h3 a { color: #232323; }
.ys-hk-govde h3 a:hover { color: #ec5598; }
.ys-hk-govde p { font-size: 14.8px; color: #6f6f6f; line-height: 1.75; margin-bottom: 18px; }
.ys-hk-link { font-weight: 600; color: #ec5598; font-size: 14.5px; }
.ys-hk-link i { font-size: 12px; margin-left: 6px; transition: transform .25s ease; }
.ys-hk:hover .ys-hk-link i { transform: translateX(5px); }
.ys-hk-link:hover { color: #6a1b9a; }

/* ==========================================================================
   35) SABİT (YAPIŞKAN) MENÜ
   ========================================================================== */
.ys-sabit-bar {
    position: fixed; left: 0; right: 0; top: 0; z-index: 900;
    background: rgba(255, 255, 255, .97); backdrop-filter: saturate(160%) blur(8px);
    box-shadow: 0 6px 26px rgba(0, 0, 0, .12);
    transform: translateY(-100%); transition: transform .35s ease;
    border-bottom: 3px solid #ec5598;
}
.ys-sabit-bar.gorunur { transform: translateY(0); }
.ys-sabit-ic {
    display: flex; align-items: center; justify-content: space-between; gap: 20px;
    padding: 10px 0; min-height: 66px;
}
.ys-sabit-logo img { max-height: 46px; width: auto; display: block; }
.ys-sabit-menu { display: flex; align-items: center; gap: 4px; list-style: none; margin: 0; padding: 0; }
.ys-sabit-menu li a {
    display: block; padding: 10px 14px; border-radius: 30px;
    font-size: 15px; font-weight: 500; color: #232323; text-transform: capitalize;
}
.ys-sabit-menu li a:hover { color: #ec5598; background: #fdeaf3; }
.ys-sabit-menu li.aktif a { color: #fff; background: #ec5598; }
.ys-sabit-sag { display: flex; align-items: center; gap: 10px; }
.ys-sabit-tel {
    display: inline-flex; align-items: center; gap: 8px; background: #6a1b9a; color: #fff;
    font-weight: 600; font-size: 14.5px; padding: 11px 20px; border-radius: 30px; white-space: nowrap;
}
.ys-sabit-tel:hover { background: #ec5598; color: #fff; }
.ys-sabit-menu-btn {
    display: none; border: 0; background: #ec5598; color: #fff;
    width: 44px; height: 44px; border-radius: 12px; font-size: 18px; cursor: pointer;
}
@media (max-width: 991px) {
    .ys-sabit-menu { display: none; }
    .ys-sabit-menu-btn { display: inline-block; }
    .ys-sabit-logo img { max-height: 38px; }
    .ys-sabit-tel { padding: 10px 14px; font-size: 13.5px; }
}
@media (max-width: 400px) { .ys-sabit-tel span { display: none; } }

/* ==========================================================================
   36) INSTAGRAM — özgün marka rengiyle
   ========================================================================== */
.ys-ig {
    display: inline-flex; align-items: center; justify-content: center; gap: 9px;
    width: 42px; height: 42px; border-radius: 12px; color: #fff; font-size: 19px;
    background: radial-gradient(circle at 30% 107%,
        #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285aeb 90%);
    box-shadow: 0 6px 16px rgba(214, 36, 159, .32);
    transition: transform .25s ease, box-shadow .25s ease, filter .25s ease;
    flex: 0 0 auto;
}
.ys-ig:hover { color: #fff; transform: translateY(-3px); box-shadow: 0 12px 26px rgba(214, 36, 159, .45); filter: saturate(115%); }
.ys-ig-genis { width: auto; height: 46px; padding: 0 20px; border-radius: 30px; font-size: 15px; font-weight: 600; }
.ys-ig-genis span { font-size: 14.5px; }
.ys-ig-buyuk { width: 56px; height: 56px; border-radius: 16px; font-size: 25px; }

.ys-sos {
    display: inline-flex; align-items: center; justify-content: center;
    width: 42px; height: 42px; border-radius: 12px; color: #fff; font-size: 17px;
    transition: transform .25s ease;
}
.ys-sos:hover { color: #fff; transform: translateY(-3px); }
.ys-sos-fb { background: #1877f2; }
.ys-sos-yt { background: #ff0000; }

/* İletişim sayfası Instagram kutusu */
.ys-ig-kutu {
    background: #fff; border: 1px solid #f0e7de; border-radius: 14px;
    padding: 24px 22px; margin-bottom: 30px; box-shadow: 0 10px 26px rgba(0, 0, 0, .05);
}
.ys-ig-kutu-ust { display: flex; align-items: center; gap: 14px; margin-bottom: 18px; }
.ys-ig-kutu h3 { font-size: 19px; margin: 0 0 4px; color: #232323; }
.ys-ig-kutu p { font-size: 13.5px; color: #7b7b7b; margin: 0; line-height: 1.55; }

/* ==========================================================================
   37) ÜST ARAÇLAR — Instagram + açılır arama çubuğu
   ========================================================================== */
.ys-ust-araclar {
    display: flex; align-items: center; justify-content: flex-end; gap: 12px;
    height: 100%; position: relative;
}
.ys-arama { position: relative; }
.ys-arama form {
    display: flex; align-items: center; background: transparent; border-radius: 12px;
    overflow: hidden; width: 42px;
    transition: width .35s ease, box-shadow .3s ease, background-color .3s ease, border-radius .3s ease;
    position: absolute; right: 0; top: 50%; transform: translateY(-50%);
}
.ys-arama.acik form {
    width: 300px; background: #fff; border-radius: 30px;
    box-shadow: 0 10px 26px rgba(0, 0, 0, .18);
}
.ys-arama input {
    width: 0; flex: 1 1 auto; min-width: 0; border: 0; outline: 0; background: transparent;
    height: 42px; padding: 0; font-size: 14px; color: #232323;
    opacity: 0; transition: opacity .25s ease, padding .3s ease;
}
.ys-arama.acik input { opacity: 1; padding: 0 6px 0 18px; }
.ys-arama-btn {
    flex: 0 0 42px; width: 42px; height: 42px; border: 0; cursor: pointer;
    background: #6a1b9a; color: #fff; font-size: 15px; border-radius: 12px;
    display: flex; align-items: center; justify-content: center;
    transition: background .25s ease, border-radius .3s ease, transform .25s ease;
}
.ys-arama-btn:hover { background: #232323; transform: translateY(-3px); }
.ys-arama.acik .ys-arama-btn { border-radius: 0 30px 30px 0; transform: none; }
/* Arama kapalıyken buton konteynerin genişliğini belirler */
.ys-arama { width: 42px; height: 42px; }

/* ==========================================================================
   38) FOOTER — boşluk düzeni ve sosyal alan
   ========================================================================== */
footer .ys-footer-ust { padding-top: 72px; padding-bottom: 26px; }
footer .footer-widget { margin-bottom: 34px; }
footer .footer-title { padding-bottom: 20px !important; margin-bottom: 0; }
footer .footer-widget .textwidget p { margin-bottom: 18px; }
footer .widget_nav_menu ul li, footer .widget_recent_entries ul li { margin-bottom: 4px; }
.ys-footer-sosyal { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 4px; }
footer .footer-copyright { padding-top: 22px !important; padding-bottom: 22px !important; }
.ys-alt-baglantilar { display: flex; gap: 22px; justify-content: flex-end; flex-wrap: wrap; }
.ys-alt-baglantilar a { color: rgba(255, 255, 255, .72); font-size: 14.5px; }
.ys-alt-baglantilar a:hover { color: #fff; }
@media (max-width: 767px) {
    footer .ys-footer-ust { padding-top: 54px; padding-bottom: 10px; }
    .ys-alt-baglantilar { justify-content: flex-start; margin-top: 14px; }
}

/* ==========================================================================
   39) ANASAYFA — bölüm boşlukları, hero genişliği, hakkımızda görseli
   ========================================================================== */
/* Hero: özgün genişliğinde kalır (1200 px konteyner) */

.ys-sec-kutular { padding-bottom: 55px !important; }
.ys-sec-kartlar { padding-top: 45px !important; padding-bottom: 25px !important; }
.ys-sec-paketler { padding-top: 70px !important; }
.ys-sec-galeri-baslik { padding-top: 70px !important; padding-bottom: 40px !important; }
.ys-sec-galeri { padding-bottom: 50px !important; }
.ys-neden-sec { padding-top: 75px !important; padding-bottom: 75px !important; }
.ys-sec-blog-baslik { padding-top: 60px !important; padding-bottom: 30px !important; }
.ys-about-sec .about-area { padding-top: 85px !important; padding-bottom: 85px !important; }

/* Hakkımızda arka plan görseli: soldaki fotoğraflar kesilmesin,
   metin tarafı ise her zaman temiz bir zemin üzerinde dursun. */
.ys-about-sec { background-position: 20% center; background-color: #f7f4f8; }
.ys-about-sec .about-area { position: relative; }
.ys-about-sec .about-area::after {
    content: ''; position: absolute; inset: 0; z-index: 0; pointer-events: none;
    background: linear-gradient(90deg,
        rgba(247, 244, 248, 0) 16%,
        rgba(247, 244, 248, .55) 28%,
        rgba(247, 244, 248, .94) 40%,
        #f7f4f8 52%);
}
.ys-about-sec .about-area > .container,
.ys-about-sec .about-area > .spape { position: relative; z-index: 1; }
@media (max-width: 991px) {
    .ys-about-sec { background-position: center right; }
    .ys-about-sec .about-area::after { background: rgba(247, 244, 248, .92); }
}

/* Geniş CTA kutusundaki buton kontrastı */
.ys-genis-cta-btn .pink-btn { background: #fff !important; color: #6a1b9a !important; }
.ys-genis-cta-btn .pink-btn:hover { background: #232323 !important; color: #fff !important; }