/* =========================================================
   teklif-sayfa.css
   Sigortababası — Teklif Al Sayfası Stilleri
   ========================================================= */

#teklif {
  padding-top: 40px;
  padding-bottom: 60px;
}

.teklif-baslik {
  font-size: 2rem;
  font-weight: 800;
  color: #111827;
  margin-bottom: 10px;
}

.teklif-alt {
  color: #6b7280;
  font-size: 1rem;
  margin-bottom: 0;
}

/* ---- Grup Başlığı ---- */
.teklif-grup-baslik {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 0.85rem;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: #6b7280;
  margin-bottom: 14px;
  margin-top: 10px;
}

.teklif-grup-ikon {
  width: 28px;
  height: 28px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
}

.teklif-grup-ikon--mavi    { background: #e8f1fb; color: #1a56c4; }
.teklif-grup-ikon--turuncu { background: #fff4e5; color: #d68000; }
.teklif-grup-ikon--yesil   { background: #e8f8ef; color: #1a8a4a; }
.teklif-grup-ikon--gri     { background: #f3f4f6; color: #6b7280; }

/* ---- Kart Genel ---- */
.teklif-kart {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 28px 18px 22px;
  border-radius: 16px;
  text-decoration: none;
  color: #111827;
  background: #ffffff;
  border: 1.5px solid transparent;
  position: relative;
  overflow: hidden;
  height: 100%;
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
  box-shadow: 0 2px 10px rgba(0,0,0,0.05);
}

.teklif-kart::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 4px;
  border-radius: 16px 16px 0 0;
}

.teklif-kart:hover {
  transform: translateY(-5px);
  box-shadow: 0 16px 36px rgba(0,0,0,0.11);
  text-decoration: none;
  color: #111827;
}

/* İkon kutusu */
.teklif-kart__ikon {
  width: 64px;
  height: 64px;
  border-radius: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 26px;
  margin-bottom: 16px;
  transition: transform 0.2s ease;
}

.teklif-kart:hover .teklif-kart__ikon {
  transform: scale(1.08);
}

.teklif-kart h4 {
  font-size: 0.97rem;
  font-weight: 500;
  margin: 0 0 6px;
  color: #111827;
}

.teklif-kart p {
  font-size: 0.8rem;
  color: #6b7280;
  margin: 0 0 14px;
  line-height: 1.5;
}

/* Etiket */
.teklif-kart__etiket {
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 3px 10px;
  border-radius: 20px;
  margin-top: auto;
}

/* =========================================================
   RENK TEMAları
   ========================================================= */

/* Mavi */
.teklif-kart--mavi::before          { background: #1a56c4; }
.teklif-kart--mavi                  { border-color: #dce9fb; }
.teklif-kart--mavi:hover            { border-color: #9dbef5; }
.teklif-kart--mavi .teklif-kart__ikon { background: #e8f1fb; color: #1a56c4; }
.teklif-kart--mavi .teklif-kart__etiket { background: #e8f1fb; color: #1a56c4; }

/* İndigo */
.teklif-kart--indigo::before        { background: #4c35be; }
.teklif-kart--indigo                { border-color: #e4e0fb; }
.teklif-kart--indigo:hover          { border-color: #b8aef7; }
.teklif-kart--indigo .teklif-kart__ikon { background: #eeedfb; color: #4c35be; }
.teklif-kart--indigo .teklif-kart__etiket { background: #eeedfb; color: #4c35be; }

/* Kırmızı */
.teklif-kart--kirmizi::before       { background: #c0392b; }
.teklif-kart--kirmizi               { border-color: #fde8e6; }
.teklif-kart--kirmizi:hover         { border-color: #f5ada7; }
.teklif-kart--kirmizi .teklif-kart__ikon { background: #fdecea; color: #c0392b; }
.teklif-kart--kirmizi .teklif-kart__etiket { background: #fdecea; color: #c0392b; }

/* Mor */
.teklif-kart--mor::before           { background: #7c3aed; }
.teklif-kart--mor                   { border-color: #ede9fb; }
.teklif-kart--mor:hover             { border-color: #c4b5f7; }
.teklif-kart--mor .teklif-kart__ikon { background: #f3f0fd; color: #7c3aed; }
.teklif-kart--mor .teklif-kart__etiket { background: #f3f0fd; color: #7c3aed; }

/* Turuncu */
.teklif-kart--turuncu::before       { background: #d68000; }
.teklif-kart--turuncu               { border-color: #fdf0d8; }
.teklif-kart--turuncu:hover         { border-color: #f8d58a; }
.teklif-kart--turuncu .teklif-kart__ikon { background: #fff4e5; color: #d68000; }
.teklif-kart--turuncu .teklif-kart__etiket { background: #fff4e5; color: #d68000; }

/* Sarı */
.teklif-kart--sari::before          { background: #b45309; }
.teklif-kart--sari                  { border-color: #fef3c7; }
.teklif-kart--sari:hover            { border-color: #fcd97a; }
.teklif-kart--sari .teklif-kart__ikon { background: #fefce8; color: #b45309; }
.teklif-kart--sari .teklif-kart__etiket { background: #fefce8; color: #b45309; }

/* Yeşil */
.teklif-kart--yesil::before         { background: #1a8a4a; }
.teklif-kart--yesil                 { border-color: #d6f0e2; }
.teklif-kart--yesil:hover           { border-color: #86d4ad; }
.teklif-kart--yesil .teklif-kart__ikon { background: #e8f8ef; color: #1a8a4a; }
.teklif-kart--yesil .teklif-kart__etiket { background: #e8f8ef; color: #1a8a4a; }

/* Teal */
.teklif-kart--teal::before          { background: #0e8a82; }
.teklif-kart--teal                  { border-color: #d6f2f0; }
.teklif-kart--teal:hover            { border-color: #7dd6d1; }
.teklif-kart--teal .teklif-kart__ikon { background: #e5f8f6; color: #0e8a82; }
.teklif-kart--teal .teklif-kart__etiket { background: #e5f8f6; color: #0e8a82; }

/* Pembe */
.teklif-kart--pembe::before         { background: #be185d; }
.teklif-kart--pembe                 { border-color: #fce7f3; }
.teklif-kart--pembe:hover           { border-color: #f7a8d2; }
.teklif-kart--pembe .teklif-kart__ikon { background: #fdf2f8; color: #be185d; }
.teklif-kart--pembe .teklif-kart__etiket { background: #fdf2f8; color: #be185d; }

/* Açık Mavi */
.teklif-kart--acik-mavi::before     { background: #0284c7; }
.teklif-kart--acik-mavi             { border-color: #e0f2fe; }
.teklif-kart--acik-mavi:hover       { border-color: #7dd3f7; }
.teklif-kart--acik-mavi .teklif-kart__ikon { background: #f0f9ff; color: #0284c7; }
.teklif-kart--acik-mavi .teklif-kart__etiket { background: #f0f9ff; color: #0284c7; }

/* Lacivert */
.teklif-kart--lacivert::before      { background: #1e3a5f; }
.teklif-kart--lacivert              { border-color: #dde4ee; }
.teklif-kart--lacivert:hover        { border-color: #8faecb; }
.teklif-kart--lacivert .teklif-kart__ikon { background: #eaf0f7; color: #1e3a5f; }
.teklif-kart--lacivert .teklif-kart__etiket { background: #eaf0f7; color: #1e3a5f; }

/* Kahve */
.teklif-kart--kahve::before         { background: #78350f; }
.teklif-kart--kahve                 { border-color: #fde8cc; }
.teklif-kart--kahve:hover           { border-color: #f4b97a; }
.teklif-kart--kahve .teklif-kart__ikon { background: #fef3e2; color: #78350f; }
.teklif-kart--kahve .teklif-kart__etiket { background: #fef3e2; color: #78350f; }

/* ---- Responsive ---- */
@media (max-width: 576px) {
  .teklif-kart {
    padding: 22px 14px 18px;
  }
  .teklif-kart__ikon {
    width: 52px;
    height: 52px;
    font-size: 22px;
  }
  .teklif-baslik {
    font-size: 1.5rem;
  }
}