*

/* ================= HERO ================= */
.hero {
  min-height: 70vh;
  background:
    linear-gradient(rgba(0,0,0,.65), rgba(0,0,0,.85)),
    url("images/kapak.jpg") center / cover no-repeat;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.hero-inner {
  max-width: 900px;
  padding: 20px;
}

.logo {
  width: 200px;
  max-width: 70vw;
  margin: 0 auto 18px;
  display: block;
}

.hero-title {
  font-size: clamp(32px, 6vw, 52px);
  letter-spacing: 4px;
  margin: 0 0 10px;
}

.hero-subtitle {
  font-size: clamp(15px, 3.8vw, 20px);
  line-height: 1.6;
  color: #ffd66b;
  margin-bottom: 26px;
}

.hero-actions a {
  display: inline-block;
  margin: 6px;
  padding: 14px 26px;
  background: #b00020;
  color: #fff;
  text-decoration: none;
  border-radius: 6px;
}

/* ================= MENU ================= */
.menu {
  max-width: 1000px;
  margin: 0 auto;
  padding: 60px 20px;
}

.menu h2 {
  text-align: center;
  font-size: 36px;
  color: #ffd66b;
  margin-bottom: 40px;
}

.menu h3 {
  margin-top: 40px;
  margin-bottom: 14px;
  color: #ff2a2a;
}

.menu ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.menu li {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 16px;
  padding: 12px 6px;
  border-bottom: 1px dashed #333;
}

.menu li.featured {
  background: rgba(255,214,107,.12);
}

.menu li span:last-child {
  color: #ffd66b;
  font-weight: bold;
}

/* ================= INFO ================= */
.info {
  text-align: center;
  padding: 40px 20px;
  background: #0b0b0b;
}

.phones {
  margin: 20px 0;
}

.phones a {
  display: block;
  color: #ffd66b;
  font-size: 18px;
  text-decoration: none;
  margin: 6px 0;
}

/* ================= INSTAGRAM ================= */
.instagram-wrap {
  display: flex;
  justify-content: center;
  margin: 30px 0;
}

.instagram-link {
  display: flex;
  align-items: center;
  gap: 12px;
  text-decoration: none;
  color: #ffd66b;
  font-size: 20px;
  font-weight: 800;
}

.instagram-link svg {
  width: 28px;
  height: 28px;
  fill: #E1306C;
}

/* ================= MAP ================= */
.map iframe {
  width: 100%;
  height: 320px;
  border: 0;
}

/* SOCIAL BAR */
.social-bar {
  display: flex;
  justify-content: center;
  margin: 30px 0;
}

.social.instagram {
  display: flex;
  align-items: center;
  gap: 12px;
  text-decoration: none;
}

.social.instagram img {
  width: 32px;
  height: 32px;
}

.social.instagram span {
  font-size: 20px;
  font-weight: 900;
  letter-spacing: .5px;
  color: #ffd66b;
}

.logo,
.social.instagram,
.whatsapp {
  animation: introFade .8s ease-out forwards;
}
.gallery {
  overflow-x: auto;
  padding: 30px 0;
}

.gallery-track {
  display: flex;
  gap: 16px;
  padding: 0 20px;
}

.gallery img {
  width: 240px;          /* dar */
  height: 360px;         /* uzun (dikey) */
  object-fit: cover;
  border-radius: 14px;
  box-shadow: 0 12px 32px rgba(0,0,0,.65);
  flex-shrink: 0;
  transition: transform .3s ease, box-shadow .3s ease;
}

.gallery img:hover {
  transform: scale(1.05);
  box-shadow: 0 18px 40px rgba(0,0,0,.75);
}
@media (max-width: 768px) {
  .gallery img {
    width: 200px;
    height: 300px;
  }
}
body {
  margin: 0;
  font-family: Arial, Helvetica, sans-serif;
  color: #1a1a1a;
  background-color: #f6f1e7;
  background-image:
    repeating-linear-gradient(
      135deg,
      rgba(0,0,0,0.07),
      rgba(0,0,0,0.07) 1px,
      transparent 1px,
      transparent 22px
    );
}
h1, h2, h3 {
  color: #1b1b1b;
  letter-spacing: 1.5px;
}

p, li, span {
  color: #333;
  font-size: 16px;
}

.menu span {
  color: #8b0000; /* fiyatlar koyu kırmızı */
  font-weight: 700;
}

.info,
.instagram-wrap,
.phones {
  background: transparent !important;
}
.info {
  max-width: 900px;
  margin: 40px auto;
  padding: 30px 20px;
  background: #ffffff;
  border-radius: 14px;
  box-shadow: 0 14px 40px rgba(0,0,0,0.12);
}
.instagram-link span {
  font-size: 18px;
  font-weight: 800;
  letter-spacing: 0.6px;
  color: #111;
}

.phones a {
  font-size: 17px;
  font-weight: 600;
  color: #8b0000;
}
.hero {
  background:
    linear-gradient(
      rgba(0,0,0,0.45),
      rgba(0,0,0,0.65)
    ),
    url("images/kapak.jpg") center / cover no-repeat;
}
.menu li span:last-child {
  font-size: 18px;
  font-weight: 900;
  color: #6b0000; /* koyu premium kırmızı */
  letter-spacing: 0.5px;
}
.menu li.featured span:last-child {
  color: #000;
  background: linear-gradient(90deg, #ffd66b, #ffefb0);
  padding: 4px 10px;
  border-radius: 999px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}
.menu h2 {
  font-size: 40px;
  font-weight: 900;
  letter-spacing: 3px;
  color: #1a1a1a;
  text-transform: uppercase;
}
.menu h2::after {
  height: 4px;
  width: 180px;
  background: linear-gradient(90deg, transparent, #6b0000, transparent);
}
.menu h3 {
  font-size: 24px;
  font-weight: 800;
  color: #6b0000;
  letter-spacing: 1.2px;
  text-transform: uppercase;
}
@media (max-width: 768px) {
  .menu h2 {
    font-size: 34px;
  }

  .menu h3 {
    font-size: 22px;
  }

  .menu li span:last-child {
    font-size: 17px;
  }
}
/* === ANA MENÜ BAŞLIĞI – ÇOK BELİRGİN === */
.menu h2 {
  font-size: 42px;
  font-weight: 900;
  letter-spacing: 4px;
  text-transform: uppercase;

  color: #1a1a1a;
  background: linear-gradient(180deg, #fff6d6, #ffe7a3);
  padding: 14px 28px;
  border-radius: 14px;

  display: inline-block;
  margin: 0 auto 40px;
  box-shadow:
    0 10px 25px rgba(0,0,0,0.18),
    inset 0 0 0 2px rgba(107,0,0,0.35);
}
.menu h3 {
  font-size: 26px;
  font-weight: 900;
  letter-spacing: 1.5px;
  color: #6b0000;
  text-transform: uppercase;
  margin-top: 50px;
}
/* === ÇOK SATAN – İKONLU ROZET === */
.menu li.featured {
  position: relative;
  background: linear-gradient(
    90deg,
    rgba(255,215,107,.35),
    rgba(255,215,107,.15),
    rgba(255,215,107,.35)
  );
}

.menu li.featured::before {
  content: "⭐ Çok Satan";
  position: absolute;
  left: -6px;
  top: -10px;

  background: linear-gradient(135deg, #6b0000, #a00000);
  color: #fff;

  font-size: 12px;
  font-weight: 800;
  letter-spacing: .6px;

  padding: 6px 12px;
  border-radius: 999px;

  box-shadow: 0 6px 18px rgba(0,0,0,.35);
}
@media (max-width: 768px) {
  .menu h2 {
    font-size: 34px;
    letter-spacing: 3px;
  }

  .menu h3 {
    font-size: 22px;
  }

  .menu li.featured::before {
    font-size: 11px;
    padding: 5px 10px;
  }
}
/* === MENÜ BAŞLIĞI KESİN ORTA === */
.menu {
  text-align: center;
}

.menu h2 {
  margin-left: auto !important;
  margin-right: auto !important;
}
/* === MENÜ HİZALAMA DÜZELTME === */
.menu {
  text-align: left !important;
}

.menu h2 {
  text-align: center !important;
}

.menu ul {
  text-align: left !important;
}

.menu li {
  justify-content: space-between !important;
}
/* === HERO BAŞLIK – RENK DÜZELTME === */
.hero-title {
  background: linear-gradient(180deg, #7a0d0d, #b00020);
  color: #fff;

  box-shadow:
    0 14px 30px rgba(0,0,0,.45),
    inset 0 0 0 2px rgba(255,214,107,.45);

  text-shadow:
    0 2px 6px rgba(0,0,0,.6);
}
/* === HERO BAŞLIK – RENK DÜZELTME === */
.hero-title {
  background: linear-gradient(180deg, #7a0d0d, #b00020);
  color: #fff;

  box-shadow:
    0 14px 30px rgba(0,0,0,.45),
    inset 0 0 0 2px rgba(255,214,107,.45);

  text-shadow:
    0 2px 6px rgba(0,0,0,.6);
}
/* === HERO BAŞLIK GİRİŞ ANİMASYONU === */
.hero-title {
  opacity: 0;
  transform: translateY(18px);
  animation: heroTitleIn 0.9s cubic-bezier(.2,.8,.2,1) forwards;
}

@keyframes heroTitleIn {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
/* === MENÜ BAŞLIK KESİN ORTALAMA === */
.menu h2 {
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
/* === HERO BAŞLIK – ŞEFFAF TABELA === */
.hero-title {
  background: rgba(0,0,0,0.45);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);

  color: #ffd66b;
  border: 1px solid rgba(255,214,107,.55);

  box-shadow:
    0 18px 35px rgba(0,0,0,.55),
    inset 0 0 0 1px rgba(255,214,107,.35);

  text-shadow:
    0 2px 6px rgba(0,0,0,.7);
}
/* === HERO BUTON GİRİŞ ANİMASYONU === */
.hero-actions a {
  opacity: 0;
  transform: translateY(16px);
  animation: heroBtnIn .7s ease-out forwards;
}

.hero-actions a:nth-child(1) { animation-delay: .4s; }
.hero-actions a:nth-child(2) { animation-delay: .55s; }

@keyframes heroBtnIn {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
/* === ÇOK SATAN ROZETİ – ÇAKIŞMA FIX === */
.menu li.featured {
  position: relative;
  padding-top: 18px;
}

.menu li.featured::before {
  top: -6px; /* ⬅ milim yukarı */
}
/* === HERO BAŞLIK ÇERÇEVE ŞEFFAF FIX === */
.hero-title {
  border: 1px solid rgba(255,255,255,.18) !important;
  box-shadow:
    0 18px 35px rgba(0,0,0,.55),
    inset 0 0 0 1px rgba(255,255,255,.12);
}
/* === FAHRETTİN USTA – SABİT PREMIUM PARILTI === */
.hero-title {
  display: inline-block !important;
  text-align: center !important;

  color: #f6e6a8 !important;

  text-shadow:
    0 0 6px rgba(255,215,120,0.45),
    0 0 18px rgba(255,215,120,0.35),
    0 0 32px rgba(255,215,120,0.25) !important;
}
/* === MENÜ BAŞLIĞI – TAM ORTA (FORCE) === */
.menu h2 {
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* === MENÜ ALT ÇİZGİ – KISA & ORTALI === */
.menu h2::after {
  content: "" !important;
  display: block !important;

  width: 90px !important;
  height: 3px !important;

  margin: 14px auto 34px !important;

  background: linear-gradient(
    90deg,
    transparent,
    #d4af37,
    transparent
  ) !important;
}
/* === MENÜ BAŞLIĞI – TEMİZ & ALTIN === */
.menu h2 {
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;

  color: #d4af37 !important; /* altın sarısı */
  letter-spacing: 2px;
}

/* Alt çizgi / çerçeve VARSA tamamen kaldır */
.menu h2::before,
.menu h2::after {
  content: none !important;
  display: none !important;
}
/* === MENÜ BAŞLIĞI – TEMİZ & ALTIN === */
.menu h2 {
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;

  color: #d4af37 !important; /* altın sarısı */
  letter-spacing: 2px;
}

/* Alt çizgi / çerçeve VARSA tamamen kaldır */
.menu h2::before,
.menu h2::after {
  content: none !important;
  display: none !important;
}
/* === FAHRETTİN USTA – ÇERÇEVE KESİN SİL === */
.hero-title,
.hero h1,
header.hero h1 {
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}

/* varsa before / after ile çizilen her şeyi öldür */
.hero-title::before,
.hero-title::after,
.hero h1::before,
.hero h1::after {
  content: none !important;
  display: none !important;
}
/* === MENÜ BAŞLIĞI – TEMİZ ORTALI === */
.menu h2 {
  display: block !important;
  width: 100% !important;

  text-align: center !important;
  margin: 0 auto 30px auto !important;
  padding: 0 !important;

  color: #d4af37 !important; /* altın */
  letter-spacing: 2px;

  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}

/* MENÜ başlığına çizgi ekleyen her şeyi yok et */
.menu h2::before,
.menu h2::after {
  content: none !important;
  display: none !important;
}
.menu {
  text-align: center !important;
}

.menu h3,
.menu ul {
  text-align: left !important; /* ürünler sola düzgün kalsın */
}
/* === MENÜ BAŞLIĞI – PARLAK & ALT ÇİZGİ === */
.menu h2 {
  position: relative;
  color: #d4af37 !important;
  text-shadow:
    0 0 6px rgba(212,175,55,.35),
    0 0 14px rgba(212,175,55,.25);
}

/* ALT ÇİZGİ */
.menu h2::after {
  content: "";
  display: block;
  width: 120px;
  height: 3px;
  margin: 14px auto 0;

  background: linear-gradient(
    90deg,
    transparent,
    #d4af37,
    transparent
  );

  box-shadow:
    0 0 8px rgba(212,175,55,.6);
}
/* === HERO ALT SLOGAN PARLAKLIK === */
.hero-subtitle,
.hero-text,
.hero p {
  text-shadow:
    0 0 6px rgba(255,214,107,.35),
    0 0 14px rgba(255,214,107,.25);
}
/* === ÇOK SATAN ROZET POZİSYON AYARI === */
.menu li.featured {
  position: relative;
}

.menu li.featured::before {
  top: -8px !important; /* ⬅ biraz yukarı aldık */
}
.menu li.featured span::after {
  position: relative;
  top: -6px;
}
/* === MENÜ BAŞLIK – ALTIN + GÖLGE ÇİZGİ === */
.menu h2 {
  text-align: center !important;
  color: #d4af37 !important; /* altın */
  font-weight: 900;
  letter-spacing: 3px;
  position: relative;
  margin-bottom: 40px;
}

/* Altındaki çizgi */
.menu h2::after {
  content: "";
  display: block;
  width: 140px;
  height: 3px;
  margin: 14px auto 0;

  background: linear-gradient(
    90deg,
    transparent,
    #d4af37,
    transparent
  );

  box-shadow:
    0 4px 10px rgba(212,175,55,.6); /* gölge efekti */
}
/* ===== MENÜ BAŞLIĞI KESİN DÜZELTME ===== */
.menu > h2 {
  all: unset;                 /* ⬅ HER ŞEYİ SIFIRLAR */
  display: block;
  text-align: center !important;
  font-size: 38px;
  font-weight: 900;
  letter-spacing: 4px;
  color: #d4af37;
  margin: 0 auto 40px;
  position: relative;
}

/* GÖLGELİ ALT ÇİZGİ */
.menu > h2::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -18px;
  transform: translateX(-50%);

  width: 120px;
  height: 4px;

  background: linear-gradient(
    90deg,
    transparent,
    #d4af37,
    transparent
  );

  box-shadow:
    0 6px 16px rgba(212,175,55,.7);
}
/* === MENÜ BAŞLIĞI ALT ÇİZGİ – MİNİMAL === */
.menu h2 {
  position: relative;
}

.menu h2::after {
  content: "";
  display: block;
  width: 90px;
  height: 3px;
  margin: 14px auto 0;

  background: linear-gradient(
    90deg,
    transparent,
    #d4af37,
    transparent
  );

  box-shadow: 0 4px 14px rgba(212,175,55,.6);
}
/* === MENÜ BAŞLIĞI ALT ÇİZGİ – FORCE === */
.menu h2 {
  position: relative !important;
  text-align: center !important;
}

.menu h2::after {
  content: "" !important;
  display: block !important;

  width: 100px !important;
  height: 4px !important;

  margin: 12px auto 0 !important;

  background-color: #d4af37 !important;
  box-shadow: 0 0 12px rgba(212,175,55,.8) !important;
}
.menu h2::after {
  content: "" !important;
  display: block !important;

  width: 110px !important;
  height: 4px !important;

  margin: 14px auto 0 !important;

  background: linear-gradient(
    90deg,
    transparent,
    #ffd66b,
    #d4af37,
    #ffd66b,
    transparent
  ) !important;

  box-shadow:
    0 0 10px rgba(255,214,107,.9),
    0 0 22px rgba(212,175,55,.8),
    0 0 40px rgba(212,175,55,.6) !important;
}
.menu h2::after {
  content: "" !important;
  display: block !important;

  width: 110px !important;
  height: 4px !important;

  margin: 14px auto 0 !important;

  background: linear-gradient(
    90deg,
    transparent,
    #ffd66b,
    #d4af37,
    #ffd66b,
    transparent
  ) !important;

  box-shadow:
    0 0 10px rgba(255,214,107,.9),
    0 0 22px rgba(212,175,55,.8),
    0 0 40px rgba(212,175,55,.6) !important;
}
.hero-title {
  color: #ffd66b;
  text-shadow:
    0 0 8px rgba(255,214,107,.45),
    0 10px 28px rgba(0,0,0,.65);
  letter-spacing: 4px;
}
.menu h2 {
  text-align: center;
  color: #ffd66b;
  text-shadow:
    0 0 10px rgba(255,214,107,.45),
    0 8px 24px rgba(0,0,0,.6);
  position: relative;
}

.menu h2::after {
  content: "";
  display: block;
  width: 120px;
  height: 3px;
  margin: 14px auto 0;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(255,214,107,.9),
    transparent
  );
  filter: blur(.2px);
}
.menu h2 {
  text-align: center;
  color: #ffd66b;
  text-shadow:
    0 0 10px rgba(255,214,107,.45),
    0 8px 24px rgba(0,0,0,.6);
  position: relative;
}

.menu h2::after {
  content: "";
  display: block;
  width: 120px;
  height: 3px;
  margin: 14px auto 0;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(255,214,107,.9),
    transparent
  );
  filter: blur(.2px);
}
.hero-actions a {
  position: relative;
  background: linear-gradient(135deg, #b00020, #e60026);
  box-shadow:
    0 0 12px rgba(176,0,32,.45),
    0 10px 26px rgba(0,0,0,.55);
}

.hero-actions a:hover {
  box-shadow:
    0 0 18px rgba(255,214,107,.55),
    0 14px 36px rgba(0,0,0,.65);
}
.hero-subtitle {
  opacity: 0;
  transform: translateY(18px);
  animation: sloganOnce .9s ease-out .4s forwards;
}

@keyframes sloganOnce {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.logo {
  width: clamp(190px, 40vw, 240px); /* ⬅ bir tık büyüdü */
  filter:
    drop-shadow(0 0 10px rgba(255,214,107,.35))
    drop-shadow(0 14px 30px rgba(0,0,0,.75));
}
* {
  will-change: transform, opacity;
}
.logo {
  filter:
    drop-shadow(0 0 14px rgba(255,214,107,.55))
    drop-shadow(0 0 28px rgba(255,214,107,.25))
    drop-shadow(0 18px 36px rgba(0,0,0,.8));
}
.hero-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 14px; /* ⬅️ ARALIK */
}
/* === GİRİŞ ANİMASYONU (TEK SEFER) === */
.hero {
  opacity: 0;
  animation: heroFade 1s ease-out forwards;
}

@keyframes heroFade {
  to { opacity: 1; }
}

.logo {
  opacity: 0;
  transform: translateY(-25px) scale(.92);
  animation: logoIntro 0.9s cubic-bezier(.2,.8,.2,1) forwards;
  animation-delay: .3s;
}

.hero-subtitle {
  opacity: 0;
  transform: translateY(20px);
  animation: textIntro .8s ease-out forwards;
  animation-delay: .6s;
}

.hero-actions a {
  opacity: 0;
  transform: translateY(20px);
  animation: textIntro .8s ease-out forwards;
  animation-delay: .9s;
}

@keyframes logoIntro {
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes textIntro {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
/* === MOBİL MENÜ BAŞLIKLARI SABİT === */
@media (max-width: 768px) {
  .menu h3 {
    position: sticky;
    top: 0;
    background: #121212;
    padding: 10px 0;
    z-index: 5;
  }
}
.map-actions {
  display: flex;
  justify-content: center;
  gap: 14px;
  margin: 18px 0;
}

.map-actions a {
  padding: 12px 20px;
  background: rgba(0,0,0,.55);
  backdrop-filter: blur(6px);
  color: #ffd66b;
  font-weight: 700;
  border-radius: 999px;
  text-decoration: none;
  box-shadow: 0 8px 22px rgba(0,0,0,.6);
}
.gallery img {
  content-visibility: auto;
  contain-intrinsic-size: 300px 420px;
}

.instagram-link:hover {
  box-shadow: 0 0 25px rgba(225,48,108,.6);
}
<div class="google-rating">
  <a href="https://www.google.com/maps/place/Fahrettin+Usta+Adana+Kebapçısı"
     target="_blank">
    <div class="stars">★★★★★</div>
    <div class="score">
      Google’da <strong>4.8 / 5</strong>
      <span>(320+ yorum)</span>
    </div>
    <a href="https://search.google.com/local/writereview?placeid=PLACE_ID_BURAYA"
   target="_blank"
   class="google-review-btn">
  ⭐ Google’da Yorum Bırak
</a>

  </a>
</div>
.google-rating {
  opacity: 0;
  transform: translateY(20px);
  animation: ratingIn .8s ease-out forwards;
  animation-delay: 1.1s;
}

@keyframes ratingIn {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.google-rating {
  margin-top: 10px;
  font-size: 15px;
  color: #ffd66b;
  letter-spacing: .4px;
  text-shadow: 0 0 8px rgba(255,214,107,.45);
}
.google-rating span {
  color: #eee;
  font-weight: 500;
}
.google-review-btn {
  display: inline-block;
  margin-top: 14px;
  padding: 12px 26px;
  border-radius: 999px;
  background: linear-gradient(135deg, #ffd66b, #e6b94f);
  color: #000;
  font-weight: 800;
  text-decoration: none;
  box-shadow:
    0 10px 25px rgba(255,214,107,.45),
    inset 0 0 0 1px rgba(255,255,255,.4);
  animation: reviewPulse 1.2s ease-out both;
}

@keyframes reviewPulse {
  from {
    transform: scale(.9);
    opacity: 0;
  }
  to {
    transform: scale(1);
    opacity: 1;
  }
}
.map-card {
  text-align: center;
  padding: 26px 20px;
  background: rgba(255,255,255,.04);
  backdrop-filter: blur(6px);
  border-radius: 14px;
  margin: 40px auto 20px;
  max-width: 520px;
  box-shadow: 0 12px 35px rgba(0,0,0,.5);
}

.map-card h3 {
  margin: 0 0 6px;
  color: #ffd66b;
}

.map-card p {
  margin: 0 0 14px;
  color: #ddd;
  font-size: 14px;
}

.map-card a {
  display: inline-block;
  padding: 10px 22px;
  border-radius: 999px;
  background: #b00020;
  color: #fff;
  text-decoration: none;
  font-weight: 700;
}
<div class="google-rating">
  <a href="https://www.google.com/maps/place/?q=place_id:ChIJ1atAAuRZtRQRrJtDaVw-sM8"
     target="_blank"
     rel="noopener">

    <div class="stars">
      ★★★★★
    </div>

    <div class="rating-text">
      Google’da 4.8 ★ (Gerçek müşteri yorumları)
    </div>

  </a>
</div>
.google-reviews {
  text-align: center;
  margin: 20px 0;
}

.google-reviews a {
  text-decoration: none;
  display: inline-block;
  padding: 12px 20px;
  border-radius: 12px;
  background: #111;
  box-shadow: 0 8px 24px rgba(0,0,0,.4);
}

.review-count {
  font-size: 18px;
  font-weight: 800;
  color: #ffd66b;
}

.review-sub {
  font-size: 13px;
  color: #ccc;
  margin-top: 4px;
}
.featured-reviews {
  text-align: center;
  padding: 40px 20px;
}

.featured-reviews h3 {
  color: #ffd66b;
  margin-bottom: 20px;
}

.review-box {
  max-width: 600px;
  margin: 14px auto;
  padding: 16px;
  background: #111;
  border-radius: 12px;
  box-shadow: 0 8px 24px rgba(0,0,0,.45);
  font-size: 15px;
}
.local-seo {
  text-align: center;
  padding: 40px 20px;
}

.local-seo h2 {
  font-size: 26px;
  color: #ffd66b;
  margin-bottom: 10px;
}

.local-seo p {
  max-width: 700px;
  margin: 0 auto;
  color: #ddd;
  line-height: 1.6;
}
.google-reviews a {
  background: linear-gradient(145deg, #151515, #0a0a0a);
  border: 1px solid rgba(255,214,107,.25);
  box-shadow:
    0 12px 30px rgba(0,0,0,.6),
    inset 0 0 0 1px rgba(255,214,107,.08);
  transition: transform .25s ease, box-shadow .25s ease;
}

.google-reviews a:hover {
  transform: translateY(-2px);
  box-shadow:
    0 18px 40px rgba(0,0,0,.7),
    0 0 18px rgba(255,214,107,.35);
}

.review-count {
  font-size: 20px;
  font-weight: 900;
  color: #ffd66b;
  letter-spacing: 1px;
  text-shadow: 0 0 12px rgba(255,214,107,.45);
}

.review-sub {
  font-size: 14px;
  color: #e0e0e0;
}
.featured-reviews h3 {
  font-size: 26px;
  font-weight: 900;
  letter-spacing: 2px;
  color: #ffd66b;
  text-shadow: 0 0 14px rgba(255,214,107,.45);
}

.review-box {
  background: linear-gradient(145deg, #141414, #0c0c0c);
  border-left: 4px solid #ffd66b;
  color: #eee;
  box-shadow:
    0 14px 35px rgba(0,0,0,.65);
  transition: transform .25s ease;
}

.review-box:hover {
  transform: translateY(-3px);
}

.review-box p {
  margin-top: 6px;
  line-height: 1.6;
}
.local-seo {
  background:
    radial-gradient(circle at top, rgba(255,214,107,.08), transparent 60%);
  border-radius: 18px;
}

.local-seo h2 {
  font-size: 30px;
  font-weight: 900;
  color: #ffd66b;
  letter-spacing: 2px;
  text-shadow:
    0 0 18px rgba(255,214,107,.45),
    0 10px 30px rgba(0,0,0,.7);
}

.local-seo p {
  font-size: 16px;
  color: #f0f0f0;
}
.google-reviews,
.featured-reviews,
.local-seo {
  opacity: 0;
  transform: translateY(20px);
  animation: fadeUp .8s ease-out forwards;
}

.featured-reviews { animation-delay: .15s; }
.local-seo { animation-delay: .3s; }

@keyframes fadeUp {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
/* === GOOGLE TARZI YORUM KUTULARI === */
.review-box {
  background: #ffffff;
  color: #202124;
  border-radius: 16px;
  padding: 22px 24px;
  box-shadow:
    0 1px 2px rgba(60,64,67,.15),
    0 2px 6px rgba(60,64,67,.2);
  position: relative;
  transition: transform .2s ease, box-shadow .2s ease;
}

/* Hover – Google hissi */
.review-box:hover {
  transform: translateY(-2px);
  box-shadow:
    0 4px 8px rgba(60,64,67,.25),
    0 8px 20px rgba(60,64,67,.2);
}

/* Yıldızlar */
.review-box .stars {
  color: #fbbc04; /* Google sarısı */
  font-size: 16px;
  margin-bottom: 8px;
}

/* Yorum metni */
.review-box p {
  margin: 0;
  font-size: 15px;
  line-height: 1.6;
  color: #3c4043;
}

/* İsim */
.review-box strong {
  display: block;
  margin-top: 14px;
  font-size: 14px;
  font-weight: 700;
  color: #1a73e8; /* Google mavi */
}

/* Google sol renk şeridi */
.review-box::before {
  content: "";
  position: absolute;
  left: 0;
  top: 14px;
  bottom: 14px;
  width: 5px;
  border-radius: 4px;
  background: linear-gradient(
    to bottom,
    #1a73e8, /* mavi */
    #34a853, /* yeşil */
    #fbbc04, /* sarı */
    #ea4335  /* kırmızı */
  );
}
/* ===============================
   GOOGLE YORUMLAR – PREMIUM
   =============================== */

.google-reviews {
  padding: 60px 20px;
  text-align: center;
  background: transparent;
}

.google-title {
  font-size: 34px;
  font-weight: 900;
  letter-spacing: 2px;
  margin-bottom: 26px;
  color: #fbbc05; /* Google Sarısı */
  text-align: center;
}

.google-card {
  max-width: 900px;
  margin: 0 auto 26px;
  border-radius: 18px;
  overflow: hidden;
  background: #fff;
  box-shadow:
    0 18px 40px rgba(0,0,0,.25);
  border: 4px solid #4285F4; /* Google Mavi */
}

.google-card iframe {
  width: 100%;
  height: 420px;
  border: none;
}

/* === Yorum Butonu === */
.google-review-btn {
  display: inline-block;
  padding: 14px 30px;
  border-radius: 999px;
  background: linear-gradient(
    135deg,
    #4285F4,
    #34A853,
    #FBBC05,
    #EA4335
  );
  color: #fff;
  font-weight: 800;
  font-size: 16px;
  text-decoration: none;
  box-shadow: 0 10px 30px rgba(0,0,0,.35);
  transition: transform .2s ease, box-shadow .2s ease;
}

.google-review-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 36px rgba(0,0,0,.45);
}

/* === MOBİL === */
@media (max-width: 768px) {
  .google-title {
    font-size: 28px;
  }

  .google-card iframe {
    height: 300px;
  }
}
/* === MOBİL MENÜ BAŞLIK ÇİZGİ KALDIR === */
@media (max-width: 768px) {
  .menu h3 {
    background: none !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
  }
}

/* === INSTAGRAM KULLANICI ADI – ÇERÇEVE === */
.instagram-premium span {
  font-size: 18px;
  font-weight: 900;
  letter-spacing: 1px;

  color: #ffd66b;

  padding: 6px 14px;
  border-radius: 10px;

  border: 1px solid rgba(255,215,0,.55);

  background: linear-gradient(
    135deg,
    rgba(255,215,0,.12),
    rgba(255,215,0,.04)
  );

  text-shadow:
    0 0 6px rgba(255,214,107,.45),
    0 6px 18px rgba(0,0,0,.65);

  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.08),
    0 6px 18px rgba(0,0,0,.45);
}
@media (max-width: 768px) {
  .instagram-premium span {
    font-size: 17px;
    padding: 5px 12px;
  }
}
/* ===============================
   INSTAGRAM – PREMIUM ÇERÇEVELİ
   =============================== */

.instagram-premium {
  display: flex;
  justify-content: center;
  margin: 30px 0;
}

.instagram-premium a {
  display: flex;
  align-items: center;
  gap: 12px;
  text-decoration: none;
}

.instagram-premium img {
  width: 34px;
  height: 34px;
}

.instagram-premium span {
  font-size: 18px;
  font-weight: 900;
  letter-spacing: 1px;

  color: #ffd66b;

  padding: 6px 14px;
  border-radius: 10px;

  border: 1px solid rgba(255,215,0,.6);

  background: linear-gradient(
    135deg,
    rgba(255,215,0,.18),
    rgba(255,215,0,.05)
  );

  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.08),
    0 6px 18px rgba(0,0,0,.45);

  text-shadow:
    0 0 6px rgba(255,214,107,.55),
    0 6px 18px rgba(0,0,0,.7);
}

/* MOBİL */
@media (max-width: 768px) {
  .instagram-premium span {
    font-size: 17px;
    padding: 5px 12px;
  }
}

/* === INSTAGRAM LOGO (ÇERÇEVE İÇİNDE) === */
.instagram-premium img {
  width: 30px;
  height: 30px;

  border-radius: 50%;

  padding: 6px;

  background:
    radial-gradient(circle at top, #ffdc80, #e1306c, #833ab4);

  box-shadow:
    inset 0 0 0 2px rgba(255,255,255,.25),
    0 6px 14px rgba(0,0,0,.6);
}

/* === KULLANICI ADI === */
.instagram-premium span {
  font-size: 19px;
  font-weight: 900;
  letter-spacing: 1.3px;

  color: #fff;

  text-shadow:
    0 2px 6px rgba(0,0,0,.9);
}

/* 👆 EMOJİ */
.instagram-premium span::after {
  content: "  👆";
  font-size: 20px;
}

/* HOVER */
.instagram-premium a:hover {
  transform: translateY(-2px);
  box-shadow:
    0 0 22px rgba(255,214,107,.55),
    0 18px 40px rgba(0,0,0,.75);
}

/* NABIZ – PREMIUM */
@keyframes instaPulse {
  0%   { box-shadow: 0 0 0 rgba(255,214,107,.35); }
  50%  { box-shadow: 0 0 24px rgba(255,214,107,.65); }
  100% { box-shadow: 0 0 0 rgba(255,214,107,.35); }
}

/* MOBİL */
@media (max-width: 768px) {
  .instagram-premium span {
    font-size: 18px;
  }

  .instagram-premium img {
    width: 28px;
    height: 28px;
  }
}
/* ===============================
   MOBİL MENÜ BAŞLIĞI ÇAKIŞMA FIX
   =============================== */
@media (max-width: 768px) {

  .menu h3 {
    position: static !important;   /* ❗ Üst üste binmeyi bitirir */
    margin-top: 48px !important;   /* Bölümler arası net boşluk */
    margin-bottom: 16px !important;
    z-index: auto !important;
  }

  .menu ul {
    margin-top: 0 !important;
  }

  /* Çok Satan rozeti başlığı etkilemesin */
  .menu li.featured {
    position: relative;
    padding-top: 14px;
  }

  .menu li.featured::before {
    top: -10px !important; /* rozeti biraz yukarı al */
  }
}

.instagram-card {
  display: flex;
  justify-content: center;
  margin: 40px 0;
}

.instagram-card a {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 22px;
  background: linear-gradient(135deg, #1a1a1a, #000);
  border-radius: 16px;
  text-decoration: none;
  box-shadow: 0 12px 30px rgba(0,0,0,.35);
  transition: transform .2s ease, box-shadow .2s ease;
}

.instagram-card a:hover {
  transform: translateY(-2px);
  box-shadow: 0 16px 36px rgba(0,0,0,.45);
}

.instagram-card img {
  width: 36px;
  height: 36px;
}

.ig-text {
  display: flex;
  flex-direction: column;
  line-height: 1.2;
}

.ig-label {
  font-size: 13px;
  color: #ccc;
  letter-spacing: .5px;
}

.ig-text strong {
  font-size: 18px;
  font-weight: 900;
  color: #ffd66b;
}

* {
  will-change: transform;
}

img {
  max-width: 100%;
  height: auto;
}
/* === INSTAGRAM PREMIUM ROZET (SOFİSTİKE) === */
.social-bar {
  display: flex;
  justify-content: center;
  margin: 36px 0 20px;
}

.social.instagram {
  display: inline-flex;
  align-items: center;
  gap: 12px;

  padding: 12px 22px;

  background: rgba(0,0,0,.55);
  backdrop-filter: blur(6px);

  border-radius: 999px;

  text-decoration: none;

  border: 1px solid rgba(255,214,107,.45);

  box-shadow:
    0 8px 24px rgba(0,0,0,.55);
}

/* Instagram logosu */
.social.instagram img {
  width: 26px;
  height: 26px;
}

/* Kullanıcı adı */
.social.instagram span {
  font-size: 18px;
  font-weight: 800;
  letter-spacing: 0.8px;
  color: #ffd66b;
}

/* küçük dokunuş */
.social.instagram span::after {
  content: " 👆";
}

/* Mobil */
@media (max-width: 768px) {
  .social.instagram {
    padding: 10px 18px;
  }

  .social.instagram span {
    font-size: 16px;
  }

  .social.instagram img {
    width: 24px;
    height: 24px;
  }
}
/* === SAFARI ARKA PLAN GARANTİ === */
@supports (-webkit-touch-callout: none) {
  body {
    background-color: #f3efe8;
    background-image:
      radial-gradient(circle at 1px 1px, rgba(0,0,0,.06) 1px, transparent 0);
    background-size: 14px 14px;
  }
}
/* === HIZ OPTİMİZASYONU – SAFARI & MOBİL === */
@supports (-webkit-touch-callout: none) {
  body {
    background-image:
      radial-gradient(circle at 20% 20%, rgba(255,255,255,0.03), transparent 40%),
      repeating-linear-gradient(
        45deg,
        rgba(255,255,255,0.02),
        rgba(255,255,255,0.02) 1px,
        transparent 1px,
        transparent 10px
      );
  }
}
.action-stack {
  display: flex;
  flex-direction: column; /* ⬅ ALT ALTA */
  align-items: center;
  gap: 14px;
  margin: 30px 0;
}

.action-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;

  width: 100%;
  max-width: 340px;

  padding: 14px 20px;
  border-radius: 999px;
  text-decoration: none;
  font-weight: 800;
  font-size: 16px;
  letter-spacing: .4px;

  box-shadow: 0 10px 26px rgba(0,0,0,.35);
  transition: transform .2s ease, box-shadow .2s ease;
}

.action-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 32px rgba(0,0,0,.45);
}

/* INSTAGRAM */
.instagram-btn {
  background: linear-gradient(45deg, #f58529, #dd2a7b, #8134af);
  color: #fff;
}

.instagram-btn img {
  width: 22px;
  height: 22px;
}

/* GOOGLE */
.google-btn {
  background: #fff;
  color: #111;
}
.action-mini {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  margin: 28px 0;
}

/* ORTAK – YAZI BOYUNDA */
.mini-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;

  padding: 8px 14px;
  border-radius: 10px;

  font-size: 15px;
  font-weight: 800;
  letter-spacing: .4px;

  text-decoration: none;
  white-space: nowrap;

  box-shadow: 0 6px 16px rgba(0,0,0,.25);
  transition: transform .2s ease, box-shadow .2s ease;
}

.mini-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 22px rgba(0,0,0,.35);
}

/* INSTAGRAM – PREMIUM KÜÇÜK */
.mini-btn.insta {
  background: linear-gradient(
    135deg,
    #f58529,
    #dd2a7b,
    #8134af
  );
  color: #fff;
}

.mini-btn.insta img {
  width: 16px;
  height: 16px;
  filter: drop-shadow(0 1px 2px rgba(0,0,0,.4));
}

/* GOOGLE – RENKARENK (ESKİ GÜZEL HALİ) */
.mini-btn.google {
  background: linear-gradient(
    90deg,
    #4285F4,
    #34A853,
    #FBBC05,
    #EA4335
  );
  color: #fff;
  font-weight: 900;
}

/* MOBİL */
@media (max-width: 768px) {
  .mini-btn {
    font-size: 14px;
    padding: 7px 12px;
  }
}
.instagram-btn {
  display: inline-flex;
  align-items: center;
  gap: 12px;

  padding: 10px 18px;
  border-radius: 999px;

  background: linear-gradient(135deg, #833ab4, #fd1d1d, #fcb045);
  text-decoration: none;

  box-shadow: 0 10px 28px rgba(0,0,0,.35);
}

.instagram-btn img {
  width: 26px;
  height: 26px;
  display: block;
}

.instagram-btn span {
  color: #fff;
  font-weight: 800;
  font-size: 16px;
  letter-spacing: .4px;
}
/* =========================
   MOBILE = PC ZORLA AYNI
   ========================= */
@media (max-width: 9999px) {

  .social-bar,
  .instagram-btn,
  .instagram-btn svg,
  .instagram-btn span {
    all: unset;
  }

  .social-bar {
    display: flex;
    justify-content: center;
    margin: 32px 0;
  }

  .instagram-btn {
    display: inline-flex;
    align-items: center;
    gap: 14px;

    padding: 14px 22px;
    border-radius: 999px;

    background: linear-gradient(135deg,
      #833ab4,
      #fd1d1d,
      #fcb045
    );

    box-shadow: 0 16px 34px rgba(0,0,0,.35);
    text-decoration: none;
  }

  .instagram-btn svg {
    width: 26px !important;
    height: 26px !important;
    fill: #fff !important;
    display: block;
    flex-shrink: 0;
  }

  .instagram-btn span {
    color: #fff !important;
    font-size: 16px !important;
    font-weight: 800 !important;
    letter-spacing: .4px;
    white-space: nowrap;
  }
}
/* ===============================
   INSTAGRAM – ANDROID SAFE
   =============================== */

.social-bar {
  display: flex;
  justify-content: center;
  margin: 30px 0;
}

.instagram-fixed {
  position: relative;
  display: inline-flex;
  align-items: center;
  padding: 14px 26px 14px 56px;

  font-size: 16px;
  font-weight: 800;
  letter-spacing: .4px;
  color: #fff;
  text-decoration: none;

  border-radius: 999px;

  background: linear-gradient(135deg,
    #833ab4,
    #fd1d1d,
    #fcb045
  );

  box-shadow: 0 14px 32px rgba(0,0,0,.35);
}

.ig-premium {
  display: flex;
  justify-content: center;
  margin: 36px 0;
}

.ig-premium a {
  display: inline-flex;
  align-items: center;
  gap: 14px;

  padding: 14px 22px;
  border-radius: 999px;

  background: linear-gradient(135deg, #833ab4, #fd1d1d, #fcb045);
  text-decoration: none;

  box-shadow: 0 14px 32px rgba(0,0,0,.35);
  transition: transform .2s ease, box-shadow .2s ease;
}

.ig-premium a:hover {
  transform: translateY(-2px);
  box-shadow: 0 18px 40px rgba(0,0,0,.45);
}
.ig-premium {
  display: flex;
  justify-content: center;
  margin: 36px 0;
}

.ig-premium a {
  display: inline-flex;
  align-items: center;
  gap: 14px;

  padding: 14px 22px;
  border-radius: 999px;

  background: linear-gradient(135deg, #833ab4, #fd1d1d, #fcb045);
  text-decoration: none;

  box-shadow: 0 14px 32px rgba(0,0,0,.35);
  transition: transform .2s ease, box-shadow .2s ease;
}

.ig-premium a:hover {
  transform: translateY(-2px);
  box-shadow: 0 18px 40px rgba(0,0,0,.45);
}

/* GERÇEK INSTAGRAM LOGOSU */
.ig-real {
  width: 26px;
  height: 26px;
  fill: #fff;
  flex-shrink: 0;
}

/* Kullanıcı adı */
.ig-name {
  color: #fff;
  font-size: 17px;
  font-weight: 800;
  letter-spacing: .5px;
  text-shadow: 0 2px 6px rgba(0,0,0,.6);
}

@media (max-width: 768px) {
  .ig-name { font-size: 16px; }
}

@media (max-width: 768px) {
  .ig-name { font-size: 16px; }
}
/* GOOGLE ÇERÇEVE – MOBİLDE KAYBOLMA FIX */
.google-card,
.google-reviews,
.google-rating {
  display: block !important;
  max-width: 100% !important;
  margin: 30px auto !important;
  padding: 16px !important;
  background: #fff !important;
  border-radius: 16px !important;
  box-shadow:
    0 4px 10px rgba(60,64,67,.2),
    0 8px 24px rgba(60,64,67,.25) !important;
}

@media (max-width: 768px) {
  .google-card,
  .google-reviews,
  .google-rating {
    margin: 20px 14px !important;
  }
}
/* =========================
   GLOBAL RESET (SON KATMAN)
   ========================= */
img, svg {
  max-width: 100%;
  height: auto;
  display: block;
}

/* =========================
   INSTAGRAM – KESİN ÇÖZÜM
   ========================= */

/* Kapsayıcı */
.social-bar,
.instagram-wrap,
.ig-premium {
  display: flex !important;
  justify-content: center !important;
  margin: 28px 0 !important;
}

/* Buton */
.social-bar a,
.ig-premium a {
  display: inline-flex !important;
  align-items: center !important;
  gap: 12px !important;

  padding: 14px 22px !important;
  border-radius: 999px !important;

  background: linear-gradient(
    135deg,
    #833ab4,
    #fd1d1d,
    #fcb045
  ) !important;

  text-decoration: none !important;

  box-shadow:
    0 14px 32px rgba(0,0,0,.35) !important;
}

/* GERÇEK LOGO – ZORLA GÖRÜNÜR */
.social-bar img,
.ig-premium img,
.social-bar svg,
.ig-premium svg {
  width: 26px !important;
  height: 26px !important;
  min-width: 26px !important;
  min-height: 26px !important;

  opacity: 1 !important;
  visibility: visible !important;
  display: block !important;

  fill: #fff !important;
}

/* Kullanıcı adı */
.social-bar span,
.ig-premium span {
  color: #fff !important;
  font-size: 16px !important;
  font-weight: 800 !important;
  letter-spacing: .4px !important;
  white-space: nowrap !important;
}

/* =========================
   GOOGLE KUTUSU – MOBİL FIX
   ========================= */

.google-rating,
.google-reviews,
.google-card {
  display: block !important;
  width: 100% !important;
  max-width: 900px !important;

  margin: 30px auto !important;
  padding: 20px !important;

  background: #ffffff !important;
  border-radius: 18px !important;

  box-shadow:
    0 2px 6px rgba(60,64,67,.2),
    0 8px 24px rgba(60,64,67,.25) !important;
}

/* Mobilde kaybolma ÖNLEME */
@media (max-width: 768px) {
  .google-rating,
  .google-reviews,
  .google-card {
    margin: 20px 14px !important;
    padding: 18px !important;
  }
}

/* =========================
   MENÜ BAŞLIKLARI – ÇAKIŞMA BİTİR
   ========================= */

.menu h3 {
  position: static !important;
  top: auto !important;
  z-index: auto !important;

  margin-top: 48px !important;
  margin-bottom: 16px !important;

  background: none !important;
  box-shadow: none !important;
}

/* Mobilde üst üste binmeyi öldür */
@media (max-width: 768px) {
  .menu h3 {
    position: static !important;
  }
}

/* =========================
   EKSTRA GÜVENLİK
   ========================= */
* {
  box-sizing: border-box;
}
/* =========================
   INSTAGRAM – SİYAH KUTU (STABİL)
   ========================= */

.ig-black-box {
  display: flex;
  justify-content: center;
  margin: 32px 0;
}

.ig-black-box a {
  display: inline-flex;
  align-items: center;
  gap: 12px;

  padding: 12px 18px;

  background: #000;
  border-radius: 14px;

  text-decoration: none;

  box-shadow:
    0 10px 28px rgba(0,0,0,.45);

  transition: transform .2s ease, box-shadow .2s ease;
}

/* HOVER */
.ig-black-box a:hover {
  transform: translateY(-2px);
  box-shadow:
    0 16px 36px rgba(0,0,0,.6);
}

/* ==== INSTAGRAM İKONU (CSS İLE – BOZULMAZ) ==== */
.ig-icon {
  position: relative;
  width: 22px;
  height: 22px;

  border: 2px solid #fff;
  border-radius: 6px;
}

.ig-icon::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;

  width: 8px;
  height: 8px;

  border: 2px solid #fff;
  border-radius: 50%;

  transform: translate(-50%, -50%);
}

.ig-icon::after {
  content: "";
  position: absolute;
  top: 3px;
  right: 3px;

  width: 4px;
  height: 4px;

  background: #fff;
  border-radius: 50%;
}

/* ==== KULLANICI ADI ==== */
.ig-user {
  font-size: 16px;
  font-weight: 900;
  letter-spacing: 0.6px;
  color: #ffd66b;
}

/* MOBİL */
@media (max-width: 768px) {
  .ig-user {
    font-size: 15px;
  }

  .ig-icon {
    width: 20px;
    height: 20px;
  }
}
/* =========================
   INSTAGRAM – KIRMIZI KUTU (PC + MOBİL AYNI)
   ========================= */

.ig-black-box {
  display: flex;
  justify-content: center;
  margin: 32px 0;
}

.ig-black-box a {
  display: inline-flex;
  align-items: center;
  gap: 12px;

  padding: 12px 18px;

  background: linear-gradient(135deg, #8b0000, #b00020);
  border-radius: 14px;

  text-decoration: none;

  border: 1px solid rgba(255,255,255,.25);

  box-shadow:
    0 10px 28px rgba(0,0,0,.45);

  transition: transform .2s ease, box-shadow .2s ease;
}

.ig-black-box a:hover {
  transform: translateY(-2px);
  box-shadow:
    0 16px 36px rgba(0,0,0,.6);
}

/* INSTAGRAM İKONU – SAF CSS (BOZULMAZ) */
.ig-icon {
  position: relative;
  width: 22px;
  height: 22px;

  border: 2px solid #fff;
  border-radius: 6px;
}

.ig-icon::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;

  width: 8px;
  height: 8px;

  border: 2px solid #fff;
  border-radius: 50%;

  transform: translate(-50%, -50%);
}

.ig-icon::after {
  content: "";
  position: absolute;
  top: 3px;
  right: 3px;

  width: 4px;
  height: 4px;

  background: #fff;
  border-radius: 50%;
}

/* KULLANICI ADI */
.ig-user {
  font-size: 16px;
  font-weight: 900;
  letter-spacing: 0.6px;
  color: #ffd66b;
}

/* MOBİL – PC İLE AYNI */
@media (max-width: 768px) {
  .ig-user {
    font-size: 16px;
  }

  .ig-icon {
    width: 22px;
    height: 22px;
  }
}
/* =========================
   MOBİL = PC ZORLA AYNI (GOOGLE + INSTAGRAM)
   ========================= */

@media (max-width: 768px) {

  .ig-black-box a,
  .google-review-btn,
  .mini-btn,
  .instagram-btn {
    background-clip: padding-box !important;
    border: inherit !important;
    box-shadow: inherit !important;
  }

}
/* =========================
   SAFARI + IOS ANIMATION FIX
   ========================= */

@-webkit-keyframes fadeUp {
  to {
    opacity: 1;
    -webkit-transform: translateY(0);
  }
}

@keyframes fadeUp {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
/* =========================
   INSTAGRAM & GOOGLE – ANDROID SAFE
   ========================= */

.social-bar a,
.google-review-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;

  padding: 12px 18px !important;
  border-radius: 14px !important;

  border: 1px solid rgba(255,255,255,.35) !important;

  background: linear-gradient(135deg, #8b0000, #b00020) !important;

  box-shadow:
    0 10px 28px rgba(0,0,0,.45) !important;

  color: #ffd66b !important;
  text-decoration: none !important;
}

/* Instagram ikonu – SAF CSS */
.social-bar a::before {
  content: "";
  width: 18px;
  height: 18px;

  border: 2px solid #fff;
  border-radius: 5px;
  position: relative;
}

.social-bar a::after {
  content: "";
  width: 6px;
  height: 6px;
  background: #fff;
  border-radius: 50%;
  margin-left: -14px;
}

.logo,
.hero-title,
.hero-subtitle,
.hero-actions a {
  opacity: 0;
  -webkit-transform: translateY(20px);
  transform: translateY(20px);

  -webkit-animation: fadeUp .9s ease-out forwards;
  animation: fadeUp .9s ease-out forwards;
}

.hero-title { animation-delay: .2s; }
.hero-subtitle { animation-delay: .4s; }
.hero-actions a { animation-delay: .6s; }
}