/* ==========================================================================
   Uzman Psikolog Nazlı Turgut — arayüz stilleri
   Tek dosya · harici kütüphane yok
   1. Yazı tipleri      6. Bölüm başlıkları     11. İletişim
   2. Değişkenler       7. Kahraman (hero)      12. Alt bilgi
   3. Sıfırlama         8. Kartlar / ızgara     13. Yüzen düğmeler
   4. Yerleşim          9. Animasyonlu ikonlar  14. Hareket / erişim
   5. Başlık & menü    10. SSS / görüşler       15. Duyarlı kırılmalar
   ========================================================================== */

/* ------------------------------------------------------- 1. Yazı tipleri */
@font-face {
  font-family: 'Fraunces';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('../fonts/fraunces-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC,
                 U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193,
                 U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Fraunces';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('../fonts/fraunces-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF,
                 U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020,
                 U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Karla';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('../fonts/karla-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC,
                 U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193,
                 U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Karla';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url('../fonts/karla-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF,
                 U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020,
                 U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* -------------------------------------------------------- 2. Değişkenler */
:root {
  /* Zeminler — sıcak porselen / blush */
  --kagit:      #FBF6F2;
  --kagit-2:    #F5EAE4;
  --kagit-3:    #EEDFD8;
  --beyaz:      #FFFDFC;

  /* Mürekkep */
  --murekkep:   #2B1F23;
  --govde:      #6A555A;
  --soluk:      #98828A;

  /* Marka — logodan türetildi */
  --gul:        #B5708A;
  --gul-koyu:   #8B4A63;
  --gul-acik:   #E9CFD8;
  --gul-sis:    #F7E9EE;
  --kil:        #B08D82;
  --kil-acik:   #E5D3CB;
  --adaci:      #8A9B7C;
  --adaci-acik: #DDE4D5;
  --erik:       #33222B;
  --menekse:    #7B5CFF;
  --altin:      #C79A66;

  /* Ölçek */
  --kap:        1220px;
  --kap-dar:    880px;
  --r-s:        10px;
  --r-m:        18px;
  --r-l:        28px;
  --r-xl:       40px;

  /* Gölgeler — sıcak tonlu */
  --golge-s:  0 1px 2px rgba(58,32,42,.05), 0 4px 12px rgba(58,32,42,.05);
  --golge-m:  0 2px 6px rgba(58,32,42,.05), 0 14px 34px -12px rgba(58,32,42,.16);
  --golge-l:  0 4px 10px rgba(58,32,42,.05), 0 30px 70px -22px rgba(58,32,42,.24);
  --golge-gul: 0 20px 50px -20px rgba(139,74,99,.38);

  --gecis:    .38s cubic-bezier(.22,.9,.28,1);
  --gecis-h:  .22s cubic-bezier(.3,.9,.4,1);
}

/* -------------------------------------------------------- 3. Sıfırlama */
*, *::before, *::after { box-sizing: border-box; }

html {
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
  scroll-padding-top: 104px;
}

body {
  margin: 0;
  background: var(--kagit);
  color: var(--govde);
  font-family: 'Karla', 'Segoe UI', system-ui, sans-serif;
  font-size: 1.0625rem;
  line-height: 1.72;
  letter-spacing: .002em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}

/* Kağıt dokusu — çok ince tanecik */
body::before {
  content: '';
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  opacity: .5;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.045'/%3E%3C/svg%3E");
}

img, svg, video { display: block; max-width: 100%; }
img { height: auto; }

a { color: inherit; text-decoration: none; }

h1, h2, h3, h4, h5 {
  font-family: 'Fraunces', 'Iowan Old Style', Georgia, serif;
  font-variation-settings: 'SOFT' 32, 'WONK' 0, 'opsz' 60;
  color: var(--murekkep);
  font-weight: 500;
  line-height: 1.14;
  letter-spacing: -.018em;
  margin: 0 0 .6em;
  text-wrap: balance;
}
p { margin: 0 0 1.15em; text-wrap: pretty; }
p:last-child { margin-bottom: 0; }

::selection { background: var(--gul-acik); color: var(--murekkep); }

:focus-visible {
  outline: 2px solid var(--gul);
  outline-offset: 3px;
  border-radius: 4px;
}

.gizli {
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0);
  white-space: nowrap; border: 0;
}

.atla {
  position: absolute;
  left: 14px; top: -60px;
  z-index: 200;
  background: var(--murekkep);
  color: var(--kagit);
  padding: 11px 18px;
  border-radius: 0 0 var(--r-s) var(--r-s);
  font-size: .92rem;
  transition: top var(--gecis-h);
}
.atla:focus { top: 0; }

/* ---------------------------------------------------------- 4. Yerleşim */
.kap {
  width: 100%;
  max-width: var(--kap);
  margin-inline: auto;
  padding-inline: 24px;
  position: relative;
  z-index: 1;
}
.kap--dar { max-width: var(--kap-dar); }

.blm { padding-block: clamp(64px, 8.5vw, 122px); position: relative; }
.blm--sik { padding-block: clamp(46px, 6vw, 76px); }
.blm--kagit2 { background: var(--kagit-2); }
.blm--gulsis  { background: var(--gul-sis); }

/* Yumuşak, organik bölüm geçişleri */
.blm--yay { border-radius: clamp(28px, 5vw, 64px) clamp(28px, 5vw, 64px) 0 0; }
.blm--yay-alt { border-radius: 0 0 clamp(28px, 5vw, 64px) clamp(28px, 5vw, 64px); }

.izgara { display: grid; gap: clamp(24px, 3vw, 40px); }
.izgara--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.izgara--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.izgara--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }

/* --------------------------------------------------- 5. Başlık ve menü */
.ust {
  position: fixed;
  inset: 0 0 auto;
  z-index: 90;
  transition: background var(--gecis), box-shadow var(--gecis), backdrop-filter var(--gecis);
}
.ust::after {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(251, 246, 242, .82);
  backdrop-filter: saturate(1.4) blur(14px);
  -webkit-backdrop-filter: saturate(1.4) blur(14px);
  border-bottom: 1px solid rgba(176, 141, 130, .18);
  opacity: 0;
  transition: opacity var(--gecis);
  pointer-events: none;
}
.ust.yapisik::after { opacity: 1; }

.ust__ic {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  min-height: 84px;
  z-index: 2;
}
.ust.yapisik .ust__ic { min-height: 76px; }
.ust__ic > * { position: relative; z-index: 2; }

.marka { display: flex; align-items: center; flex: 0 0 auto; }
.marka img {
  width: 212px;
  height: auto;
  transition: width var(--gecis);
}
.ust.yapisik .marka img { width: 186px; }

.gezinme {
  margin-inline: auto;
  display: flex;
  align-items: center;
  gap: 2px;
}
.gezinme > a, .acilir__tetik {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 9px 14px;
  font-size: .945rem;
  font-weight: 500;
  color: var(--murekkep);
  border: 0;
  background: none;
  font-family: inherit;
  cursor: pointer;
  border-radius: 100px;
  position: relative;
  transition: color var(--gecis-h), background var(--gecis-h);
}
.gezinme > a::after {
  content: '';
  position: absolute;
  left: 14px; right: 14px; bottom: 4px;
  height: 1.5px;
  background: var(--gul);
  transform: scaleX(0);
  transform-origin: right;
  transition: transform .34s cubic-bezier(.22,.9,.28,1);
}
.gezinme > a:hover::after { transform: scaleX(1); transform-origin: left; }
.gezinme > a:hover, .acilir__tetik:hover { color: var(--gul-koyu); }
.gezinme a[aria-current="page"] { color: var(--gul-koyu); }
.gezinme a[aria-current="page"]::after { transform: scaleX(1); }

/* Açılır hizmet menüsü */
.acilir { position: relative; }
.acilir__tetik svg { width: 11px; height: 11px; transition: transform var(--gecis-h); }
.acilir:hover .acilir__tetik svg,
.acilir:focus-within .acilir__tetik svg { transform: rotate(180deg); }

.acilir__kutu {
  position: absolute;
  top: calc(100% + 10px);
  left: 50%;
  translate: -50% 0;
  width: 310px;
  padding: 10px;
  background: var(--beyaz);
  border: 1px solid rgba(176,141,130,.2);
  border-radius: var(--r-m);
  box-shadow: var(--golge-l);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-8px);
  transition: opacity var(--gecis-h), transform var(--gecis-h), visibility var(--gecis-h);
}
.acilir:hover .acilir__kutu,
.acilir:focus-within .acilir__kutu {
  opacity: 1; visibility: visible; transform: translateY(0);
}
.acilir__kutu a {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 12px;
  border-radius: var(--r-s);
  font-size: .93rem;
  font-weight: 500;
  color: var(--murekkep);
  transition: background var(--gecis-h), color var(--gecis-h);
}
.acilir__kutu a:hover { background: var(--gul-sis); color: var(--gul-koyu); }
.acilir__kutu .ikon { width: 30px; height: 30px; color: var(--gul); flex: 0 0 auto; }
.acilir__kutu small { display: block; font-size: .78rem; font-weight: 400; color: var(--soluk); line-height: 1.35; }

.ust__eylem { display: flex; align-items: center; gap: 12px; flex: 0 0 auto; }

.tel-ust {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  font-weight: 600;
  font-size: .95rem;
  color: var(--murekkep);
  letter-spacing: .01em;
}
.tel-ust .ikon { width: 30px; height: 30px; color: var(--gul); }
.tel-ust:hover { color: var(--gul-koyu); }

/* Düğmeler */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 14px 26px;
  border: 0;
  border-radius: 100px;
  font-family: inherit;
  font-size: .95rem;
  font-weight: 600;
  letter-spacing: .012em;
  line-height: 1.2;
  cursor: pointer;
  position: relative;
  overflow: hidden;
  isolation: isolate;
  transition: transform var(--gecis-h), box-shadow var(--gecis-h), color var(--gecis-h), border-color var(--gecis-h);
}
.btn .ikon { width: 20px; height: 20px; }
.btn:active { transform: translateY(1px) scale(.99); }

.btn--dolu {
  background: linear-gradient(122deg, var(--gul) 0%, var(--gul-koyu) 100%);
  color: #fff;
  box-shadow: var(--golge-gul);
}
.btn--dolu::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(122deg, var(--gul-koyu) 0%, #6E3A4E 100%);
  opacity: 0;
  transition: opacity var(--gecis-h);
}
.btn--dolu:hover { transform: translateY(-2px); box-shadow: 0 26px 54px -20px rgba(139,74,99,.55); }
.btn--dolu:hover::before { opacity: 1; }

.btn--cizgi {
  background: transparent;
  color: var(--murekkep);
  box-shadow: inset 0 0 0 1.5px rgba(176,141,130,.5);
}
.btn--cizgi:hover {
  box-shadow: inset 0 0 0 1.5px var(--gul);
  color: var(--gul-koyu);
  transform: translateY(-2px);
}

.btn--acik { background: var(--beyaz); color: var(--murekkep); box-shadow: var(--golge-m); }
.btn--acik:hover { transform: translateY(-2px); box-shadow: var(--golge-l); }

.btn--yesil { background: #1FA855; color: #fff; box-shadow: 0 18px 40px -18px rgba(31,168,85,.6); }
.btn--yesil:hover { background: #178E46; transform: translateY(-2px); }

.btn--kucuk { padding: 10px 18px; font-size: .875rem; }
.btn--tam { width: 100%; }

/* Metin bağlantısı — altı çizilen ok */
.baglanti {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-weight: 600;
  font-size: .92rem;
  color: var(--gul-koyu);
  letter-spacing: .015em;
}
.baglanti svg { width: 17px; height: 17px; transition: transform var(--gecis-h); }
.baglanti:hover svg { transform: translateX(5px); }

/* Hamburger */
.hamburger {
  display: none;
  width: 46px; height: 46px;
  border: 1px solid rgba(176,141,130,.35);
  border-radius: 50%;
  background: var(--beyaz);
  cursor: pointer;
  padding: 0;
  place-items: center;
}
.hamburger span {
  display: block;
  width: 18px; height: 1.6px;
  margin: 3.4px auto;
  background: var(--murekkep);
  border-radius: 2px;
  transition: transform var(--gecis-h), opacity var(--gecis-h);
}
.hamburger[aria-expanded="true"] span:nth-child(1) { transform: translateY(5px) rotate(45deg); }
.hamburger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.hamburger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-5px) rotate(-45deg); }

/* Mobil menü */
.perde {
  position: fixed; inset: 0;
  background: rgba(43,31,35,.42);
  backdrop-filter: blur(3px);
  opacity: 0; visibility: hidden;
  transition: opacity var(--gecis), visibility var(--gecis);
  z-index: 95;
}
.perde.acik { opacity: 1; visibility: visible; }

.mnav {
  position: fixed;
  top: 0; right: 0; bottom: 0;
  width: min(360px, 88vw);
  background: var(--kagit);
  z-index: 96;
  transform: translateX(102%);
  transition: transform .44s cubic-bezier(.22,.9,.28,1);
  display: flex;
  flex-direction: column;
  padding: 22px 24px 32px;
  overflow-y: auto;
  box-shadow: -20px 0 60px -20px rgba(43,31,35,.3);
}
.mnav.acik { transform: none; }
.mnav__ust { display: flex; align-items: center; justify-content: space-between; margin-bottom: 26px; }
.mnav__ust img { width: 174px; }
.mnav__kapat {
  width: 42px; height: 42px;
  border-radius: 50%;
  border: 1px solid rgba(176,141,130,.35);
  background: var(--beyaz);
  color: var(--murekkep);
  font-size: 1.35rem;
  line-height: 1;
  cursor: pointer;
}
.mnav nav { display: flex; flex-direction: column; }
.mnav nav a {
  padding: 13px 0;
  font-family: 'Fraunces', Georgia, serif;
  font-variation-settings: 'SOFT' 32, 'opsz' 30;
  font-size: 1.2rem;
  color: var(--murekkep);
  border-bottom: 1px solid rgba(176,141,130,.16);
  display: flex; align-items: center; gap: 12px;
  transition: color var(--gecis-h), padding-left var(--gecis-h);
}
.mnav nav a:hover { color: var(--gul-koyu); padding-left: 6px; }
.mnav nav a .ikon { width: 26px; height: 26px; color: var(--gul); }
.mnav__alt { margin-top: auto; padding-top: 28px; display: grid; gap: 10px; }

/* ------------------------------------------------- 6. Bölüm başlıkları */
.etiket {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--gul-koyu);
  margin-bottom: 18px;
}
.etiket::before {
  content: '';
  width: 26px; height: 1.5px;
  background: currentColor;
  opacity: .55;
}
.etiket--ortala { justify-content: center; }
.etiket--ortala::after {
  content: '';
  width: 26px; height: 1.5px;
  background: currentColor;
  opacity: .55;
}

.baslik {
  font-size: clamp(2rem, 4.1vw, 3.35rem);
  margin-bottom: .35em;
}
.baslik--kucuk { font-size: clamp(1.7rem, 3vw, 2.5rem); }
.baslik em, .sayfabas h1 em {
  font-style: normal;
  color: var(--gul-koyu);
  font-variation-settings: 'SOFT' 60, 'WONK' 1, 'opsz' 90;
  position: relative;
  white-space: nowrap;
}
/* El çizimi vurgu altı */
.baslik em::after, .sayfabas h1 em::after {
  content: '';
  position: absolute;
  left: -2%; right: -2%; bottom: -.06em;
  height: .34em;
  background: var(--gul-acik);
  border-radius: 50%;
  opacity: .5;
  z-index: -1;
  transform: rotate(-.6deg);
}
.baslik em, .sayfabas h1 em { z-index: 1; }

.giris {
  font-size: clamp(1.03rem, 1.35vw, 1.16rem);
  color: var(--govde);
  max-width: 62ch;
}
.orta { text-align: center; }
.orta .giris { margin-inline: auto; }
.orta .baslik em::after { z-index: -1; }

.blm__ust {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 32px;
  margin-bottom: clamp(34px, 4vw, 56px);
}
.blm__ust .giris { margin-bottom: 0; }

/* ------------------------------------------------------- 7. Kahraman */
.hero {
  position: relative;
  padding-top: clamp(120px, 15vw, 168px);
  padding-bottom: clamp(56px, 7vw, 96px);
  overflow: hidden;
  background:
    radial-gradient(58% 62% at 82% 22%, rgba(233,207,216,.62) 0%, rgba(233,207,216,0) 62%),
    radial-gradient(46% 52% at 8% 78%, rgba(221,228,213,.55) 0%, rgba(221,228,213,0) 64%),
    linear-gradient(178deg, var(--kagit) 0%, var(--kagit-2) 100%);
}

.hero__ic {
  display: grid;
  grid-template-columns: 1.14fr .86fr;
  align-items: center;
  gap: clamp(28px, 4vw, 58px);
}

.hero__rozet {
  display: inline-flex;
  align-items: center;
  gap: 11px;
  padding: 8px 18px 8px 10px;
  background: rgba(255,253,252,.78);
  border: 1px solid rgba(176,141,130,.26);
  border-radius: 100px;
  font-size: .8rem;
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--murekkep);
  margin-bottom: 26px;
  box-shadow: var(--golge-s);
}
.hero__rozet .ikon { width: 26px; height: 26px; color: var(--gul); }

.hero h1 {
  font-size: clamp(2.3rem, 4.4vw, 3.7rem);
  line-height: 1.08;
  letter-spacing: -.026em;
  margin-bottom: .44em;
  max-width: 13ch;
}
.hero h1 em {
  font-style: normal;
  color: var(--gul-koyu);
  font-variation-settings: 'SOFT' 70, 'WONK' 1, 'opsz' 120;
}

.hero__metin {
  font-size: clamp(1.04rem, 1.4vw, 1.2rem);
  max-width: 52ch;
  margin-bottom: 34px;
}

.hero__dugmeler { display: flex; flex-wrap: wrap; gap: 14px; margin-bottom: 40px; }

.hero__guven {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 30px;
  list-style: none;
  margin: 0;
  padding: 26px 0 0;
  border-top: 1px solid rgba(176,141,130,.26);
}
.hero__guven li {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: .88rem;
  font-weight: 600;
  color: var(--murekkep);
  letter-spacing: .01em;
}
.hero__guven .ikon { width: 26px; height: 26px; color: var(--adaci); }

/* Portre sahnesi */
.sahne { position: relative; aspect-ratio: 1 / 1.1; }
.sahne__svg { position: absolute; left: -12%; top: -4%; width: 124%; height: auto; aspect-ratio: 1 / 1.05; }

/* Fotoğraf, sürekli biçim değiştiren organik bir forma oturur —
   böylece hiçbir kenarı "kesilmiş" gibi görünmez. */
.sahne__portre {
  position: absolute;
  left: 50%; top: 50%;
  translate: -50% -50%;
  width: 90%;
  max-width: 430px;
  aspect-ratio: 1 / 1.1;
  object-fit: cover;
  object-position: 50% 14%;
  border-radius: 56% 44% 48% 52% / 42% 46% 54% 58%;
  box-shadow:
    0 0 0 9px rgba(255, 253, 252, .5),
    0 34px 68px -26px rgba(58, 32, 42, .42);
  animation: morf-foto 19s ease-in-out infinite;
  z-index: 2;
}
@keyframes morf-foto {
  0%, 100% { border-radius: 56% 44% 48% 52% / 42% 46% 54% 58%; }
  34%      { border-radius: 44% 56% 58% 42% / 54% 40% 60% 46%; }
  67%      { border-radius: 50% 50% 40% 60% / 60% 52% 48% 40%; }
}
.sahne__kart {
  position: absolute;
  z-index: 3;
  background: rgba(255,253,252,.9);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(176,141,130,.22);
  border-radius: var(--r-m);
  padding: 13px 17px;
  box-shadow: var(--golge-m);
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: .82rem;
  line-height: 1.3;
  color: var(--murekkep);
  font-weight: 600;
  animation: yuzdur 7s ease-in-out infinite;
}
.sahne__kart small { display: block; font-weight: 400; font-size: .74rem; color: var(--soluk); }
.sahne__kart .ikon { width: 30px; height: 30px; color: var(--gul); flex: 0 0 auto; }
.sahne__kart--1 { left: -11%; top: 11%; animation-delay: -1.2s; }
.sahne__kart--2 { right: -7%; top: 48%; animation-delay: -3.6s; }
.sahne__kart--3 { left: -3%; bottom: 9%; animation-delay: -5.1s; }

@keyframes yuzdur {
  0%, 100% { transform: translateY(0) }
  50%      { transform: translateY(-11px) }
}

/* Kayan şerit */
.serit {
  background: var(--erik);
  color: var(--kagit-2);
  padding-block: 16px;
  overflow: hidden;
  position: relative;
}
.serit__ray { display: flex; width: max-content; animation: kay 34s linear infinite; }
.serit__grup { display: flex; align-items: center; gap: 46px; padding-right: 46px; }
.serit__grup span {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  font-family: 'Fraunces', Georgia, serif;
  font-variation-settings: 'SOFT' 40, 'opsz' 40;
  font-size: 1.02rem;
  letter-spacing: .03em;
  white-space: nowrap;
  opacity: .92;
}
.serit__grup span::before {
  content: '';
  width: 5px; height: 5px;
  border-radius: 50%;
  background: var(--gul);
  flex: 0 0 auto;
}
@keyframes kay { to { transform: translateX(-50%) } }
.serit:hover .serit__ray { animation-play-state: paused; }

/* ------------------------------------------------ 8. Kartlar / ızgara */
.kart {
  position: relative;
  display: flex;
  flex-direction: column;
  background: var(--beyaz);
  border: 1px solid rgba(176,141,130,.2);
  border-radius: var(--r-l);
  padding: clamp(24px, 2.6vw, 34px);
  overflow: hidden;
  transition: transform var(--gecis), box-shadow var(--gecis), border-color var(--gecis);
}
.kart .baglanti { margin-top: auto; align-self: flex-start; }
.kart::before {
  content: '';
  position: absolute;
  top: -60px; right: -60px;
  width: 170px; height: 170px;
  border-radius: 50%;
  background: radial-gradient(circle, var(--gul-sis) 0%, transparent 70%);
  opacity: 0;
  transition: opacity var(--gecis);
}
.kart:hover {
  transform: translateY(-6px);
  box-shadow: var(--golge-l);
  border-color: rgba(181,112,138,.36);
}
.kart:hover::before { opacity: 1; }
.kart > * { position: relative; z-index: 1; }

.kart h3 {
  font-size: 1.3rem;
  margin-bottom: .5em;
  letter-spacing: -.012em;
}
.kart p { font-size: .97rem; margin-bottom: 1.3em; }

.kart__ikon {
  width: 66px; height: 66px;
  border-radius: 20px;
  display: grid;
  place-items: center;
  margin-bottom: 22px;
  background: linear-gradient(150deg, var(--gul-sis), var(--kagit-2));
  border: 1px solid rgba(181,112,138,.2);
  color: var(--gul-koyu);
  transition: transform var(--gecis), background var(--gecis);
}
.kart__ikon .ikon { width: 36px; height: 36px; }
.kart:hover .kart__ikon { transform: translateY(-3px) rotate(-4deg); }

.kart--adaci .kart__ikon {
  background: linear-gradient(150deg, var(--adaci-acik), var(--kagit-2));
  border-color: rgba(138,155,124,.3);
  color: #55663F;
}
.kart--kil .kart__ikon {
  background: linear-gradient(150deg, var(--kil-acik), var(--kagit-2));
  border-color: rgba(176,141,130,.34);
  color: #8A6455;
}

.kart__sayi {
  position: absolute;
  top: 18px; right: 24px;
  font-family: 'Fraunces', Georgia, serif;
  font-variation-settings: 'SOFT' 60, 'WONK' 1, 'opsz' 120;
  font-size: 3.4rem;
  line-height: 1;
  color: var(--gul-acik);
  opacity: .5;
  z-index: 0;
  pointer-events: none;
}

/* ==========================================================================
   Hizmet kartları — çizimli ikili düzen, kenarda gezinen ışık
   ========================================================================== */
@property --hk-aci { syntax: '<angle>'; initial-value: 0deg; inherits: false; }

.hizmet-izgara {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(18px, 2.2vw, 28px);
}

.hkart {
  --ton:       var(--gul);
  --ton-koyu:  var(--gul-koyu);
  --ton-acik:  var(--gul-sis);
  --ton-cizgi: rgba(181,112,138,.34);

  position: relative;
  display: grid;
  grid-template-columns: clamp(146px, 15vw, 194px) minmax(0, 1fr);
  align-items: center;
  gap: clamp(16px, 2vw, 28px);
  padding: clamp(20px, 2.2vw, 28px);
  background: var(--beyaz);
  border: 1px solid rgba(176,141,130,.2);
  border-radius: var(--r-l);
  box-shadow: var(--golge-s);
  transition: transform var(--gecis), box-shadow var(--gecis), border-color var(--gecis);
}
.hkart:hover,
.hkart:focus-within {
  transform: translateY(-6px);
  box-shadow: var(--golge-l);
  border-color: var(--ton-cizgi);
}

/* Görselin arkasındaki yumuşak ton yıkaması */
.hkart__gorsel::after {
  content: '';
  position: absolute;
  left: -18%; top: -22%;
  width: 136%; aspect-ratio: 1;
  background: radial-gradient(circle at 50% 50%, var(--ton-acik) 0%, transparent 66%);
  opacity: .85;
  pointer-events: none;
  z-index: 0;
}

/* Kenarda dolaşan ışık — kartın kendi köşe yarıçapını izler */
.hkart::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  padding: 1.6px;
  background: conic-gradient(from var(--hk-aci),
              transparent 0 54%,
              var(--ton) 66%,
              var(--beyaz) 73%,
              var(--ton-koyu) 80%,
              transparent 93%);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
          mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
          mask-composite: exclude;
  opacity: .5;                     /* durağan haliyle köşeye düşen ışık */
  transition: opacity .5s ease;
  pointer-events: none;
  z-index: 2;
}
.hkart:hover::after,
.hkart:focus-within::after {
  opacity: 1;
  animation: hk-don 4.6s linear infinite;
}
@keyframes hk-don { from { --hk-aci: 0deg; } to { --hk-aci: 360deg; } }

/* Çizim alanı — organik leke içinde */
.hkart__gorsel {
  position: relative;
  aspect-ratio: 1;
  display: grid;
  place-items: center;
}
.hkart__leke {
  position: absolute;
  inset: 3%;
  z-index: 1;
  background: linear-gradient(155deg, var(--ton-acik), transparent 76%);
  border-radius: 54% 46% 49% 51% / 46% 53% 47% 54%;
  animation: hk-morf 18s ease-in-out infinite;
  pointer-events: none;
}
@keyframes hk-morf {
  0%, 100% { border-radius: 54% 46% 49% 51% / 46% 53% 47% 54%; }
  34%      { border-radius: 45% 55% 57% 43% / 55% 44% 56% 45%; }
  67%      { border-radius: 50% 50% 42% 58% / 58% 51% 49% 42%; }
}
.hkart__gorsel img {
  position: relative;
  z-index: 2;
  width: 100%;
  height: auto;
  transition: transform var(--gecis);
}
.hkart:hover .hkart__gorsel img,
.hkart:focus-within .hkart__gorsel img { transform: translateY(-5px) scale(1.045); }

/* Izgara öğesi olduğu için z-index'e position gerekmez; gerekseydi
   aşağıdaki uzatılmış bağlantı kartın tamamını değil bu sütunu kaplardı. */
.hkart__metin { z-index: 2; }
.hkart__etiket {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin-bottom: 11px;
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--ton-koyu);
}
.hkart__etiket::before {
  content: '';
  width: 22px; height: 1px;
  background: currentColor;
  opacity: .55;
}
.hkart__metin h3 {
  font-size: clamp(1.18rem, 1.5vw, 1.36rem);
  margin-bottom: .48em;
  letter-spacing: -.012em;
}
.hkart__metin p {
  font-size: .95rem;
  line-height: 1.66;
  margin-bottom: 1.1em;
}
.hkart .baglanti { color: var(--ton-koyu); }
/* Kartın tamamı tıklanabilir olsun ama bağlantı tek kalsın */
.hkart .baglanti::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: var(--r-l);
  z-index: 3;
}

/* Durağan ışık her kartta farklı köşeye düşsün diye başlangıç açıları ayrı */
.hkart--adaci {
  --hk-aci: 145deg;
  --ton: #7E9166;
  --ton-koyu: #55663F;
  --ton-acik: var(--adaci-acik);
  --ton-cizgi: rgba(138,155,124,.42);
}
.hkart--kil {
  --hk-aci: 250deg;
  --ton: var(--kil);
  --ton-koyu: #8A6455;
  --ton-acik: var(--kil-acik);
  --ton-cizgi: rgba(176,141,130,.44);
}
.hkart--altin {
  --hk-aci: 60deg;
  --ton: var(--altin);
  --ton-koyu: #9A7038;
  --ton-acik: #F1E2CD;
  --ton-cizgi: rgba(199,154,102,.44);
}

@media (max-width: 1020px) {
  .hizmet-izgara { grid-template-columns: 1fr; }
  .hkart { grid-template-columns: clamp(160px, 24vw, 214px) minmax(0, 1fr); }
}
@media (max-width: 620px) {
  .hkart {
    grid-template-columns: 1fr;
    gap: 6px;
    text-align: center;
    padding: 10px clamp(20px, 5vw, 26px) clamp(24px, 5vw, 28px);
  }
  .hkart__gorsel { width: min(182px, 58%); margin-inline: auto; }
  .hkart__etiket { margin-bottom: 9px; }
}
@media (prefers-reduced-motion: reduce) {
  .hkart__leke { animation: none; }
  .hkart:hover::after, .hkart:focus-within::after { animation: none; }
}

/* Adım kartı — süreç */
.surec { position: relative; --g: clamp(24px, 3vw, 40px); }
.surec .izgara { gap: var(--g); }

.adim { position: relative; }

/* Numara ve ikon tek rozette birleşir */
.adim__rozet {
  position: relative;
  z-index: 1;
  width: 76px; height: 76px;
  margin-bottom: 22px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: linear-gradient(152deg, var(--gul-sis), var(--beyaz) 78%);
  border: 1.5px solid var(--gul-acik);
  color: var(--gul-koyu);
  box-shadow: 0 0 0 8px var(--kagit), var(--golge-s);
  transition: transform var(--gecis), border-color var(--gecis);
}
.adim:hover .adim__rozet { transform: translateY(-4px); border-color: var(--gul); }
.adim__rozet .ikon { width: 34px; height: 34px; }

.adim__no {
  position: absolute;
  top: -5px; left: -9px;
  min-width: 28px; height: 28px;
  padding: 0 7px;
  display: grid;
  place-items: center;
  border-radius: 100px;
  background: var(--gul-koyu);
  color: var(--beyaz);
  font-family: 'Fraunces', Georgia, serif;
  font-variation-settings: 'opsz' 18;
  font-size: .76rem;
  font-weight: 600;
  letter-spacing: .03em;
  box-shadow: 0 0 0 3.5px var(--kagit);
}

.adim h3 { font-size: 1.16rem; margin-bottom: .45em; }
.adim p { font-size: .95rem; margin: 0; max-width: 30ch; }

/* Rozetleri birbirine bağlayan kesikli çizgi — son adımdan sonra yok */
.adim:not(:last-child)::after {
  content: '';
  position: absolute;
  top: 37px;
  left: 92px;
  width: calc(100% + var(--g) - 100px);
  height: 2px;
  background: repeating-linear-gradient(90deg, var(--gul-acik) 0 6px, transparent 6px 15px);
  animation: adim-akis 13s linear infinite;
  pointer-events: none;
}
@keyframes adim-akis { to { background-position-x: -63px; } }

/* Uzmanlık rozetleri */
/* Uzmanlık başlıkları — dağınık rozet yığını yerine hizalı ikili liste */
.rozetler {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.rozetler li {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  align-items: center;
  gap: 13px;
  padding: 11px 15px 11px 11px;
  background: var(--beyaz);
  border: 1px solid rgba(176,141,130,.22);
  border-radius: 15px;
  font-size: .89rem;
  font-weight: 600;
  line-height: 1.35;
  color: var(--murekkep);
  box-shadow: 0 1px 2px rgba(58,32,42,.03);
  transition: transform var(--gecis-h), border-color var(--gecis-h), box-shadow var(--gecis-h);
}
.rozetler li:hover {
  transform: translateY(-3px);
  border-color: rgba(181,112,138,.42);
  box-shadow: var(--golge-m);
}
.rozetler .ikon {
  width: 38px; height: 38px;
  box-sizing: border-box;
  padding: 7px;
  border-radius: 12px;
  background: var(--gul-sis);
  border: 1px solid rgba(181,112,138,.16);
  color: var(--gul-koyu);
  transition: background var(--gecis-h), color var(--gecis-h);
}
.rozetler li:hover .ikon { background: var(--gul-acik); }
@media (max-width: 560px) {
  .rozetler { grid-template-columns: 1fr; gap: 9px; }
}

/* Görsel + metin ikilisi */
.ikili {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(30px, 4.4vw, 74px);
  align-items: center;
}
.ikili--ters .ikili__gorsel { order: 2; }

.gorsel-yigin { position: relative; }
.gorsel-yigin img {
  width: 100%;
  border-radius: var(--r-l);
  box-shadow: var(--golge-l);
}
.gorsel-yigin img.gorsel-yigin__kucuk {
  position: absolute;
  right: -7%;
  bottom: -9%;
  width: 52%;
  border: 7px solid var(--kagit);
  border-radius: var(--r-m);
  box-shadow: var(--golge-l);
}
.gorsel-yigin__leke {
  position: absolute;
  z-index: -1;
  inset: -8% -6% auto -8%;
  aspect-ratio: 1;
  background: linear-gradient(140deg, var(--gul-acik), var(--adaci-acik));
  opacity: .5;
  border-radius: 58% 42% 46% 54% / 44% 52% 48% 56%;
  animation: morf 16s ease-in-out infinite;
}
@keyframes morf {
  0%,100% { border-radius: 58% 42% 46% 54% / 44% 52% 48% 56%; transform: rotate(0) }
  33%     { border-radius: 42% 58% 62% 38% / 56% 40% 60% 44%; transform: rotate(5deg) }
  66%     { border-radius: 50% 50% 38% 62% / 62% 48% 52% 38%; transform: rotate(-4deg) }
}

/* Kimlik listesi (eğitim, yaklaşım) */
.liste { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.liste li {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  font-size: .98rem;
}
.liste .ikon { width: 26px; height: 26px; color: var(--gul); flex: 0 0 auto; margin-top: 1px; }
.liste strong { color: var(--murekkep); font-weight: 700; display: block; }
.liste small { color: var(--soluk); font-size: .86rem; }

/* Sayı vurguları */
.sayilar {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(14px, 1.8vw, 22px);
}
.sayi {
  text-align: center;
  padding: clamp(24px, 2.8vw, 36px) clamp(14px, 1.8vw, 24px);
  background: var(--beyaz);
  border: 1px solid rgba(176,141,130,.22);
  border-radius: var(--r-l);
  box-shadow: var(--golge-s);
  transition: transform var(--gecis), box-shadow var(--gecis), border-color var(--gecis);
}
.sayi:hover {
  transform: translateY(-4px);
  box-shadow: var(--golge-m);
  border-color: rgba(181,112,138,.34);
}
.sayi__ikon {
  width: 50px; height: 50px;
  margin: 0 auto 16px;
  border-radius: 16px;
  display: grid; place-items: center;
  background: linear-gradient(150deg, var(--gul-sis), var(--kagit-2));
  border: 1px solid rgba(181,112,138,.2);
  color: var(--gul-koyu);
}
.sayi__ikon .ikon { width: 27px; height: 27px; }
.sayi__deger {
  display: block;
  font-family: 'Fraunces', Georgia, serif;
  font-variation-settings: 'SOFT' 50, 'WONK' 1, 'opsz' 120;
  font-size: clamp(2.3rem, 3.4vw, 3.05rem);
  line-height: 1;
  font-weight: 600;
  color: var(--gul-koyu);
  letter-spacing: -.025em;
}
.sayi__ad {
  display: block;
  margin-top: 12px;
  font-size: .9rem;
  line-height: 1.45;
  color: var(--govde);
  text-wrap: balance;
}

/* ------------------------------------------- 9. Animasyonlu SVG ikonlar */
.ikon { width: 32px; height: 32px; overflow: visible; }
.ikon [stroke] { vector-effect: non-scaling-stroke; }

/* nefes alan halka */
.ik-nefes { animation: ik-nefes 4.6s ease-in-out infinite; transform-origin: center; }
@keyframes ik-nefes {
  0%, 100% { transform: scale(.86); opacity: .35 }
  50%      { transform: scale(1.06); opacity: .9 }
}
.ik-nefes-2 { animation: ik-nefes 4.6s ease-in-out infinite; animation-delay: -1.5s; transform-origin: center; }

/* çizilen yol */
.ik-ciz {
  stroke-dasharray: var(--u, 120);
  stroke-dashoffset: var(--u, 120);
  animation: ik-ciz 3.4s cubic-bezier(.6,.1,.3,1) infinite;
}
@keyframes ik-ciz {
  0%   { stroke-dashoffset: var(--u, 120) }
  45%  { stroke-dashoffset: 0 }
  80%  { stroke-dashoffset: 0; opacity: 1 }
  100% { stroke-dashoffset: 0; opacity: 0 }
}

/* nabız / kalp */
.ik-nabiz { animation: ik-nabiz 1.9s ease-in-out infinite; transform-origin: center; transform-box: fill-box; }
@keyframes ik-nabiz {
  0%, 70%, 100% { transform: scale(1) }
  35%           { transform: scale(1.18) }
  50%           { transform: scale(1.04) }
}

/* sallanan yaprak */
.ik-salla { animation: ik-salla 4.2s ease-in-out infinite; transform-origin: bottom center; transform-box: fill-box; }
@keyframes ik-salla {
  0%, 100% { transform: rotate(-7deg) }
  50%      { transform: rotate(7deg) }
}

/* dönen halka */
.ik-don { animation: ik-don 9s linear infinite; transform-origin: center; }
@keyframes ik-don { to { transform: rotate(360deg) } }
.ik-don-ters { animation: ik-don 13s linear infinite reverse; transform-origin: center; }

/* düşen damla */
.ik-damla { animation: ik-damla 2.4s ease-in infinite; }
.ik-damla-2 { animation: ik-damla 2.4s ease-in infinite; animation-delay: -.8s; }
.ik-damla-3 { animation: ik-damla 2.4s ease-in infinite; animation-delay: -1.6s; }
@keyframes ik-damla {
  0%   { transform: translateY(-3px); opacity: 0 }
  25%  { opacity: 1 }
  100% { transform: translateY(11px); opacity: 0 }
}

/* yanıp sönen nokta */
.ik-yanip { animation: ik-yanip 1.5s ease-in-out infinite; }
.ik-yanip-2 { animation: ik-yanip 1.5s ease-in-out infinite; animation-delay: -.25s; }
.ik-yanip-3 { animation: ik-yanip 1.5s ease-in-out infinite; animation-delay: -.5s; }
@keyframes ik-yanip {
  0%, 100% { opacity: .25; transform: translateY(0) }
  50%      { opacity: 1; transform: translateY(-1.6px) }
}

/* yayılan dalga */
.ik-dalga { animation: ik-dalga 2.6s ease-out infinite; transform-origin: center; }
.ik-dalga-2 { animation: ik-dalga 2.6s ease-out infinite; animation-delay: -.9s; transform-origin: center; }
@keyframes ik-dalga {
  0%   { transform: scale(.5); opacity: 0 }
  25%  { opacity: .85 }
  100% { transform: scale(1.35); opacity: 0 }
}

/* yükselen */
.ik-yuksel { animation: ik-yuksel 3s ease-in-out infinite; }
@keyframes ik-yuksel {
  0%, 100% { transform: translateY(1.5px) }
  50%      { transform: translateY(-2.5px) }
}
.ik-yuksel-2 { animation: ik-yuksel 3s ease-in-out infinite; animation-delay: -1s; }

/* parıltı */
.ik-parla { animation: ik-parla 3.2s ease-in-out infinite; transform-origin: center; transform-box: fill-box; }
@keyframes ik-parla {
  0%, 100% { opacity: .3; transform: scale(.7) }
  50%      { opacity: 1; transform: scale(1) }
}
.ik-parla-2 { animation: ik-parla 3.2s ease-in-out infinite; animation-delay: -1.1s; transform-origin: center; transform-box: fill-box; }

/* kayan çizgi (ekg) */
.ik-ekg {
  stroke-dasharray: 26 74;
  animation: ik-ekg 2.6s linear infinite;
}
@keyframes ik-ekg { to { stroke-dashoffset: -100 } }

/* Kart üzerine gelince ikon canlansın */
.kart:hover .ikon .ik-hizli { animation-duration: 1.1s; }

/* ------------------------------------------------ 10. SSS / görüşler */
.sss { display: grid; gap: 12px; }
.sss__k {
  background: var(--beyaz);
  border: 1px solid rgba(176,141,130,.22);
  border-radius: var(--r-m);
  overflow: hidden;
  transition: border-color var(--gecis-h), box-shadow var(--gecis-h);
}
.sss__k[open] { border-color: rgba(181,112,138,.4); box-shadow: var(--golge-m); }
.sss__k summary {
  list-style: none;
  cursor: pointer;
  padding: 20px 58px 20px 24px;
  position: relative;
  font-family: 'Fraunces', Georgia, serif;
  font-variation-settings: 'SOFT' 32, 'opsz' 30;
  font-size: 1.06rem;
  font-weight: 500;
  color: var(--murekkep);
  line-height: 1.4;
}
.sss__k summary::-webkit-details-marker { display: none; }
.sss__k summary::after {
  content: '';
  position: absolute;
  right: 22px; top: 50%;
  width: 13px; height: 13px;
  margin-top: -6px;
  background:
    linear-gradient(var(--gul-koyu), var(--gul-koyu)) center/13px 1.6px no-repeat,
    linear-gradient(var(--gul-koyu), var(--gul-koyu)) center/1.6px 13px no-repeat;
  transition: transform var(--gecis);
}
.sss__k[open] summary::after { transform: rotate(135deg); }
.sss__c { padding: 0 24px 22px; font-size: .98rem; }
.sss__c p:last-child { margin-bottom: 0; }
.sss__k[open] .sss__c { animation: acil .38s cubic-bezier(.22,.9,.28,1); }
/* ==========================================================================
   SSS + çağrı tek blok (yalnızca anasayfa) — solda 1/3 çağrı, sağda 2/3 SSS
   ========================================================================== */
.sblok {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);
  background: var(--beyaz);
  border: 1px solid rgba(176,141,130,.2);
  border-radius: var(--r-xl);
  box-shadow: var(--golge-l);
  overflow: hidden;
}

.sblok__cagri {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(30px, 3.2vw, 46px);
  background: linear-gradient(152deg, var(--erik) 0%, #4A2E3C 56%, #6B4152 100%);
  color: var(--kagit-2);
}
.sblok__svg {
  position: absolute;
  inset: 0;
  width: 100%; height: 100%;
  opacity: .5;
  pointer-events: none;
}
.sblok__ic { position: relative; z-index: 1; }
.etiket--acik { color: #E6A6BE; }

.sblok__cagri h2 {
  color: var(--kagit);
  font-size: clamp(1.46rem, 2.1vw, 1.94rem);
  line-height: 1.22;
  margin-bottom: .6em;
}
.sblok__cagri h2 em {
  font-style: normal;
  color: #F0AFC6;
  font-variation-settings: 'SOFT' 60, 'WONK' 1, 'opsz' 90;
}
.sblok__giris {
  color: rgba(245,234,228,.8);
  font-size: .95rem;
  margin-bottom: 26px;
}
/* Dar sütunda iki düğme yan yana sıkışmasın; eşit genişlikte alt alta dursun */
.sblok__dugmeler { display: grid; gap: 11px; }
.sblok__dugmeler .btn { justify-content: center; }

.sblok__ile {
  list-style: none;
  margin: clamp(24px, 2.6vw, 32px) 0 0;
  padding: clamp(20px, 2.2vw, 26px) 0 0;
  border-top: 1px solid rgba(245,234,228,.16);
  display: grid;
  gap: 13px;
}
.sblok__ile li { display: flex; align-items: center; gap: 12px; font-size: .92rem; }
.sblok__ile .ikon { width: 19px; height: 19px; flex: 0 0 auto; color: #E6A6BE; }
.sblok__ile a { color: var(--kagit-2); text-decoration: none; word-break: break-word; }
.sblok__ile a:hover { color: #FFF; text-decoration: underline; text-underline-offset: 3px; }

.sblok__sss { padding: clamp(26px, 3.1vw, 44px); }
.sblok__baslik {
  font-size: clamp(1.6rem, 2.5vw, 2.15rem);
  margin-bottom: clamp(20px, 2.2vw, 28px);
}
/* Beyaz blok içinde satırlar kağıt zeminle ayrışır */
.sblok .sss { gap: 10px; }
.sblok .sss__k { background: var(--kagit); }
.sblok .sss__k[open] { background: var(--beyaz); }

@media (max-width: 980px) {
  .sblok { grid-template-columns: 1fr; }
  .sblok__cagri { padding: clamp(28px, 5vw, 40px); }
  .sblok__dugmeler { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 520px) {
  .sblok__dugmeler { grid-template-columns: 1fr; }
}

@keyframes acil {
  from { opacity: 0; transform: translateY(-7px) }
  to   { opacity: 1; transform: none }
}

/* Danışan görüşleri */
.gorus {
  margin: 0;                       /* figure için tarayıcı varsayılanını sıfırla */
  background: var(--beyaz);
  border: 1px solid rgba(176,141,130,.2);
  border-radius: var(--r-l);
  padding: clamp(24px, 2.6vw, 32px);
  display: flex;
  flex-direction: column;
  position: relative;
  overflow: hidden;
  transition: transform var(--gecis), box-shadow var(--gecis), border-color var(--gecis);
}
.gorus:hover { transform: translateY(-5px); box-shadow: var(--golge-l); border-color: rgba(181,112,138,.32); }
.gorus__tirnak {
  position: absolute;
  top: 8px; right: 20px;
  font-family: 'Fraunces', Georgia, serif;
  font-size: 4.6rem;
  line-height: 1;
  color: var(--gul-acik);
  opacity: .45;
  pointer-events: none;
}
.gorus__ust {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 16px;
  position: relative;
  z-index: 1;
}
.gorus__yildiz { height: 16px; width: auto; flex: 0 0 auto; }
.gorus__kaynak {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 11px;
  border-radius: 100px;
  background: var(--kagit-2);
  border: 1px solid rgba(176,141,130,.24);
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--soluk);
  white-space: nowrap;
}
.gorus__kaynak svg { width: 13px; height: 13px; }
.gorus__kaynak--dt { color: #0A8B69; border-color: rgba(10,139,105,.26); background: #EAF6F2; }
.gorus__kaynak--g  { color: #B4622F; border-color: rgba(180,98,47,.24); background: #FBF0E8; }

.gorus blockquote { margin: 0; }
.gorus p { font-size: .96rem; line-height: 1.68; margin: 0; }
.gorus__kim {
  margin-top: 22px;
  padding-top: 18px;
  border-top: 1px solid rgba(176,141,130,.2);
  display: flex;
  align-items: center;
  gap: 13px;
}
.gorus__bas {
  width: 44px; height: 44px;
  border-radius: 50%;
  display: grid; place-items: center;
  background: linear-gradient(140deg, var(--gul-acik), var(--kil-acik));
  color: var(--gul-koyu);
  font-family: 'Fraunces', Georgia, serif;
  font-size: 1.05rem;
  font-weight: 600;
  flex: 0 0 auto;
}
.gorus__kim b { display: block; color: var(--murekkep); font-size: .95rem; }
.gorus__kim span { font-size: .8rem; color: var(--soluk); }

/* Görüş rayı — ekranda tam 3 kart, gerisi kaydırmayla; kart kesilmez */
.gorus-sarmal { position: relative; }
.gorus-ray {
  --gs: clamp(14px, 1.5vw, 18px);
  --gn: 3;
  display: flex;
  gap: var(--gs);
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  overscroll-behavior-x: contain;
  padding: 10px 3px 16px;
  margin: -10px -3px -16px;
  scroll-padding-inline: 3px;      /* yatay dolgu kadar; ilk kart tam başa otursun */
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.gorus-ray::-webkit-scrollbar { width: 0; height: 0; }
.gorus-ray .gorus {
  flex: 0 0 calc((100% - (var(--gn) - 1) * var(--gs)) / var(--gn));
  scroll-snap-align: start;
}
/* Alıntı boşluğu ortalanır, imza her kartta aynı hizada dibe oturur */
.gorus-ray .gorus blockquote { flex: 1 1 auto; display: flex; align-items: center; }
.gorus-ray .gorus .gorus__kim { margin-top: auto; }

/* Ray denetimleri */
.gorus-kontrol {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: clamp(14px, 2vw, 22px);
  margin-top: clamp(20px, 2.2vw, 28px);
}
.gorus-ok {
  width: 46px; height: 46px;
  flex: 0 0 auto;
  display: grid; place-items: center;
  border-radius: 50%;
  background: var(--beyaz);
  border: 1px solid rgba(176,141,130,.28);
  color: var(--gul-koyu);
  box-shadow: var(--golge-s);
  cursor: pointer;
  transition: transform var(--gecis-h), background var(--gecis-h), color var(--gecis-h), border-color var(--gecis-h), opacity var(--gecis-h);
}
.gorus-ok svg { width: 18px; height: 18px; }
.gorus-ok:hover:not(:disabled) {
  background: var(--gul-koyu);
  border-color: var(--gul-koyu);
  color: var(--beyaz);
  transform: translateY(-2px);
}
.gorus-ok:disabled { opacity: .3; cursor: default; box-shadow: none; }
.gorus-sayac {
  font-size: .8rem;
  font-weight: 600;
  letter-spacing: .04em;
  color: var(--soluk);
  font-variant-numeric: tabular-nums;
  min-width: 62px;
}
.gorus-cizgi {
  position: relative;
  width: min(210px, 30vw);
  height: 3px;
  border-radius: 3px;
  background: rgba(176,141,130,.26);
}
.gorus-cizgi i {
  position: absolute;
  top: 0; bottom: 0; left: 0;
  width: 38%;
  border-radius: 3px;
  background: linear-gradient(90deg, var(--gul), var(--gul-koyu));
  transition: left .3s cubic-bezier(.22,.9,.28,1), width .3s cubic-bezier(.22,.9,.28,1);
}
@media (prefers-reduced-motion: reduce) {
  .gorus-ray { scroll-behavior: auto; }
  .gorus-cizgi i { transition: none; }
}

.gorus-dip {
  margin: clamp(14px, 1.6vw, 20px) 0 0;
  text-align: center;
  font-size: .9rem;
  color: var(--soluk);
}
.gorus-dip a {
  color: var(--gul-koyu);
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-color: var(--gul-acik);
}
.gorus-dip a:hover { text-decoration-color: var(--gul); }

/* Puan özeti rozeti */
.puan-ozet {
  display: inline-flex;
  align-items: center;
  gap: 16px;
  padding: 14px 20px;
  background: var(--beyaz);
  border: 1px solid rgba(176,141,130,.24);
  border-radius: var(--r-m);
  box-shadow: var(--golge-s);
  flex: 0 0 auto;
  transition: transform var(--gecis-h), box-shadow var(--gecis-h);
}
.puan-ozet:hover { transform: translateY(-3px); box-shadow: var(--golge-m); }
.puan-ozet img { width: 128px; height: auto; }
.puan-ozet__ayrac { width: 1px; align-self: stretch; background: rgba(176,141,130,.26); }
.puan-ozet__puan { display: grid; gap: 3px; }
.puan-ozet__puan b {
  font-family: 'Fraunces', Georgia, serif;
  font-variation-settings: 'SOFT' 40, 'opsz' 40;
  font-size: 1.32rem;
  line-height: 1;
  color: var(--murekkep);
}
.puan-ozet__puan b i { font-style: normal; font-size: .82rem; color: var(--soluk); }
.puan-ozet__yildiz { height: 13px; width: auto; }
.puan-ozet small { display: block; font-size: .74rem; color: var(--soluk); margin-top: 2px; }

/* Alıntı bloğu */
.alinti {
  margin: 0;
  padding: clamp(28px, 3.4vw, 46px) clamp(24px, 3vw, 52px);
  background: var(--beyaz);
  border-radius: var(--r-l);
  border-left: 3px solid var(--gul);
  box-shadow: var(--golge-m);
  font-family: 'Fraunces', Georgia, serif;
  font-variation-settings: 'SOFT' 46, 'opsz' 60;
  font-size: clamp(1.15rem, 1.9vw, 1.5rem);
  line-height: 1.5;
  color: var(--murekkep);
}
.alinti footer { margin-top: 18px; font-family: 'Karla', sans-serif; font-size: .88rem; color: var(--soluk); }

/* Yazı içeriği (hizmet sayfaları) */
.yazi { font-size: 1.045rem; }
.yazi h2 {
  font-size: clamp(1.5rem, 2.6vw, 2.1rem);
  margin-top: 2.1em;
  margin-bottom: .55em;
  padding-top: .1em;
  position: relative;
}
.yazi h2:first-child { margin-top: 0; }
.yazi h3 { font-size: clamp(1.2rem, 1.9vw, 1.4rem); margin-top: 1.7em; margin-bottom: .5em; }
.yazi ul, .yazi ol { padding-left: 0; margin: 0 0 1.4em; list-style: none; display: grid; gap: 11px; }
.yazi ul li {
  position: relative;
  padding-left: 32px;
  font-size: 1rem;
}
.yazi ul li::before {
  content: '';
  position: absolute;
  left: 4px; top: .62em;
  width: 9px; height: 9px;
  border-radius: 50%;
  background: var(--gul-acik);
  box-shadow: 0 0 0 3px var(--gul-sis);
}
.yazi ol { counter-reset: s; }
.yazi ol li { position: relative; padding-left: 40px; counter-increment: s; }
.yazi ol li::before {
  content: counter(s);
  position: absolute;
  left: 0; top: .05em;
  width: 26px; height: 26px;
  border-radius: 50%;
  display: grid; place-items: center;
  background: var(--gul-sis);
  color: var(--gul-koyu);
  font-size: .8rem;
  font-weight: 700;
}
.yazi strong { color: var(--murekkep); font-weight: 700; }
.yazi a:not(.btn):not(.baglanti):not(.konu__geri) {
  color: var(--gul-koyu);
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
  text-decoration-color: var(--gul-acik);
}
.yazi a:not(.btn):not(.baglanti):not(.konu__geri):hover { text-decoration-color: var(--gul); }

/* ------------------------------------------- Uzmanlık alanı bölümleri */
.konular { display: grid; gap: clamp(20px, 2.6vw, 34px); }

.konu {
  position: relative;
  display: grid;
  grid-template-columns: 212px minmax(0, 1fr);
  gap: clamp(24px, 3.4vw, 52px);
  background: var(--beyaz);
  border: 1px solid rgba(176,141,130,.22);
  border-radius: var(--r-l);
  padding: clamp(26px, 3vw, 42px);
  padding-left: clamp(30px, 3.4vw, 48px);
  scroll-margin-top: 110px;
  box-shadow: var(--golge-m);
  overflow: hidden;
  transition: box-shadow var(--gecis), border-color var(--gecis), transform var(--gecis);
}
.konu:hover {
  transform: translateY(-3px);
  box-shadow: var(--golge-l);
  border-color: rgba(181,112,138,.34);
}
/* sol aksan şeridi */
.konu::before {
  content: '';
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 4px;
  background: linear-gradient(180deg, var(--gul) 0%, var(--gul-acik) 100%);
}
/* sağ üst yumuşak ışık */
.konu::after {
  content: '';
  position: absolute;
  top: -110px; right: -80px;
  width: 260px; height: 260px;
  border-radius: 50%;
  background: radial-gradient(circle, var(--gul-sis) 0%, transparent 68%);
  pointer-events: none;
}
.konu > * { position: relative; z-index: 1; }

.konu__bas { align-self: start; }
.konu__ikon {
  width: 64px; height: 64px;
  border-radius: 20px;
  display: grid; place-items: center;
  background: linear-gradient(150deg, var(--gul-sis), var(--kagit-2));
  border: 1px solid rgba(181,112,138,.22);
  color: var(--gul-koyu);
  transition: transform var(--gecis);
}
.konu:hover .konu__ikon { transform: translateY(-2px) rotate(-4deg); }
.konu__ikon .ikon { width: 34px; height: 34px; }

.konu__no {
  display: block;
  margin: 20px 0 8px;
  font-family: 'Fraunces', Georgia, serif;
  font-variation-settings: 'opsz' 20;
  font-size: .74rem;
  font-weight: 600;
  letter-spacing: .24em;
  color: var(--soluk);
}
.konu__bas h2 {
  font-size: clamp(1.28rem, 1.9vw, 1.6rem);
  line-height: 1.2;
  margin: 0;
  text-wrap: balance;
}
.konu__ozet {
  margin: 16px 0 0;
  padding-top: 15px;
  border-top: 1px solid rgba(176,141,130,.24);
  font-size: .88rem;
  line-height: 1.55;
  color: var(--soluk);
}

.konu .yazi { font-size: 1.02rem; max-width: 66ch; }
.konu .yazi p:last-child { margin-bottom: 0; }

.konu__geri {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 26px;
  font-size: .82rem;
  font-weight: 600;
  letter-spacing: .02em;
  color: var(--soluk);
  transition: color var(--gecis-h), gap var(--gecis-h);
}
.konu__geri svg { width: 15px; height: 15px; }
.konu__geri:hover { color: var(--gul-koyu); gap: 12px; }

/* Renk çeşitlemeleri */
.konu--kil::before { background: linear-gradient(180deg, var(--kil) 0%, var(--kil-acik) 100%); }
.konu--kil::after  { background: radial-gradient(circle, rgba(229,211,203,.75) 0%, transparent 68%); }
.konu--kil .konu__ikon {
  background: linear-gradient(150deg, var(--kil-acik), var(--kagit-2));
  border-color: rgba(176,141,130,.36);
  color: #8A6455;
}
.konu--adaci::before { background: linear-gradient(180deg, var(--adaci) 0%, var(--adaci-acik) 100%); }
.konu--adaci::after  { background: radial-gradient(circle, rgba(221,228,213,.8) 0%, transparent 68%); }
.konu--adaci .konu__ikon {
  background: linear-gradient(150deg, var(--adaci-acik), var(--kagit-2));
  border-color: rgba(138,155,124,.34);
  color: #55663F;
}

/* İçerik + yan sütun */
.icerik-izgara {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 330px;
  gap: clamp(30px, 4vw, 62px);
  align-items: start;
}
.yan { position: sticky; top: 100px; display: grid; gap: 18px; }
.yan-kart {
  background: var(--beyaz);
  border: 1px solid rgba(176,141,130,.22);
  border-radius: var(--r-l);
  padding: 24px;
  box-shadow: var(--golge-s);
}
.yan-kart h3 { font-size: 1.1rem; margin-bottom: .6em; }
.yan-kart p { font-size: .92rem; margin-bottom: 1.1em; }
.yan-kart > .ikon { width: 40px; height: 40px; color: var(--gul); margin-bottom: 14px; }
.yan-kart .btn { margin-top: 9px; }
.yan-kart--cagri {
  background: linear-gradient(160deg, var(--gul-sis), var(--kagit-2));
  border-color: rgba(181,112,138,.24);
}
.yan-liste { list-style: none; margin: 0; padding: 0; display: grid; gap: 3px; }
.yan-liste a {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 10px 12px;
  border-radius: var(--r-s);
  font-size: .93rem;
  font-weight: 600;
  color: var(--murekkep);
  transition: background var(--gecis-h), color var(--gecis-h), transform var(--gecis-h);
}
.yan-liste a:hover { background: var(--gul-sis); color: var(--gul-koyu); transform: translateX(3px); }
.yan-liste a[aria-current] { background: var(--gul-sis); color: var(--gul-koyu); }
.yan-liste .ikon { width: 26px; height: 26px; color: var(--gul); flex: 0 0 auto; }

/* Bilgi kutusu */
.not {
  display: flex;
  gap: 16px;
  padding: 22px 26px;
  background: var(--gul-sis);
  border: 1px solid rgba(181,112,138,.24);
  border-radius: var(--r-m);
  margin: 2em 0;
  font-size: .97rem;
}
.not .ikon { width: 30px; height: 30px; color: var(--gul-koyu); flex: 0 0 auto; }
.not p { margin: 0; }
.not strong { display: block; color: var(--murekkep); margin-bottom: 3px; }

/* Sayfa başlığı (iç sayfalar) */
.sayfabas {
  position: relative;
  padding-top: clamp(96px, 8.6vw, 118px);
  padding-bottom: 0;
  overflow: hidden;
  background:
    radial-gradient(50% 70% at 78% 20%, rgba(233,207,216,.6) 0%, rgba(233,207,216,0) 66%),
    radial-gradient(44% 60% at 12% 90%, rgba(221,228,213,.5) 0%, rgba(221,228,213,0) 68%),
    linear-gradient(180deg, var(--kagit) 0%, var(--kagit-2) 100%);
}
.sayfabas h1 { font-size: clamp(2.1rem, 4.4vw, 3.5rem); margin-bottom: .3em; }
.sayfabas .giris { font-size: clamp(1.02rem, 1.3vw, 1.14rem); }

.sayfabas__ic {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 268px;
  gap: clamp(26px, 4.6vw, 70px);
  align-items: end;
}
.sayfabas__metin {
  position: relative;
  z-index: 2;
  padding-bottom: clamp(38px, 4.6vw, 62px);
}

/* Saydam kesim portre — alt kenara oturur, bölüm yüksekliğini şişirmez */
.sayfabas__gorsel { position: relative; aspect-ratio: .88; align-self: end; }
/* arkada duran yumuşak halka */
.sayfabas__gorsel::before {
  content: '';
  position: absolute;
  left: 2%; right: 2%;
  bottom: -6%;
  aspect-ratio: 1;
  border-radius: 50%;
  background: radial-gradient(circle at 50% 42%, rgba(233,207,216,.85) 0%, rgba(233,207,216,0) 68%);
  z-index: 0;
}
.sayfabas__svg {
  position: absolute;
  left: -30%; top: -2%;
  width: 160%; height: auto;
  aspect-ratio: 1;
  pointer-events: none;
}
.sayfabas__portre {
  position: absolute;
  inset: 0;
  z-index: 1;
  width: 100%; height: 100%;
  object-fit: cover;
  object-position: 50% 0;
  /* alt kenar bölüm sınırında yumuşasın */
  -webkit-mask-image: linear-gradient(to bottom, #000 86%, rgba(0,0,0,.4) 96%, transparent 100%);
          mask-image: linear-gradient(to bottom, #000 86%, rgba(0,0,0,.4) 96%, transparent 100%);
}
.sayfabas__rozet {
  position: absolute;
  z-index: 2;
  left: -30%;
  bottom: 17%;
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 11px 17px;
  background: rgba(255,253,252,.92);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border: 1px solid rgba(176,141,130,.24);
  border-radius: var(--r-m);
  box-shadow: var(--golge-m);
  font-size: .8rem;
  font-weight: 700;
  line-height: 1.25;
  color: var(--murekkep);
  white-space: nowrap;
  animation: yuzdur 7s ease-in-out infinite;
}
.sayfabas__rozet small {
  display: block;
  font-weight: 400;
  font-size: .72rem;
  color: var(--soluk);
}
.sayfabas__rozet .ikon { width: 28px; height: 28px; color: var(--gul); flex: 0 0 auto; }

.krumbs { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; list-style: none; margin: 0 0 22px; padding: 0; font-size: .82rem; color: var(--soluk); }
.krumbs li { display: flex; align-items: center; gap: 8px; }
.krumbs li + li::before { content: '/'; opacity: .5; }
.krumbs a:hover { color: var(--gul-koyu); }
.krumbs [aria-current] { color: var(--murekkep); font-weight: 600; }

/* ----------------------------------------------------- 11. İletişim */
.iletisim-izgara {
  display: grid;
  grid-template-columns: 1fr .82fr;
  gap: clamp(26px, 3.4vw, 52px);
  align-items: start;
}

.form-kart {
  background: var(--beyaz);
  border: 1px solid rgba(176,141,130,.22);
  border-radius: var(--r-l);
  padding: clamp(26px, 3.2vw, 44px);
  box-shadow: var(--golge-m);
}

.alanlar { display: grid; gap: 18px; grid-template-columns: 1fr 1fr; }
.alan { display: flex; flex-direction: column; gap: 7px; }
.alan--tam { grid-column: 1 / -1; }
.alan label { font-size: .82rem; font-weight: 700; color: var(--murekkep); letter-spacing: .03em; }
.alan label span { color: var(--gul); }

.alan input, .alan select, .alan textarea {
  font-family: inherit;
  font-size: .98rem;
  color: var(--murekkep);
  background: var(--kagit);
  border: 1px solid rgba(176,141,130,.3);
  border-radius: var(--r-s);
  padding: 13px 15px;
  width: 100%;
  transition: border-color var(--gecis-h), box-shadow var(--gecis-h), background var(--gecis-h);
}
.alan textarea { resize: vertical; min-height: 138px; line-height: 1.6; }
.alan input::placeholder, .alan textarea::placeholder { color: #B7A3A8; }
.alan input:focus, .alan select:focus, .alan textarea:focus {
  outline: none;
  background: var(--beyaz);
  border-color: var(--gul);
  box-shadow: 0 0 0 4px rgba(181,112,138,.14);
}
.alan select {
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8' fill='none' stroke='%238B4A63' stroke-width='1.6' stroke-linecap='round'%3E%3Cpath d='M1 1.5 6 6.5 11 1.5'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 15px center;
  background-size: 12px;
  padding-right: 40px;
}

.alan label.onay { display: flex; gap: 11px; align-items: flex-start; font-size: .84rem; font-weight: 400; color: var(--govde); letter-spacing: 0; line-height: 1.55; }
.alan label.onay span { color: var(--govde); font-weight: 400; }
.onay input { width: 17px; height: 17px; margin-top: 3px; accent-color: var(--gul); flex: 0 0 auto; }

.form__msg {
  display: none;
  margin-top: 16px;
  padding: 13px 17px;
  border-radius: var(--r-s);
  font-size: .92rem;
  line-height: 1.5;
}
.form__msg.gorunur { display: block; animation: acil .35s ease both; }
.form__msg.ok   { background: #E7F3EA; color: #1E6B39; border: 1px solid #B9DFC6; }
.form__msg.hata { background: #FBEAEC; color: #8E2637; border: 1px solid #F0C4CB; }

.bal { position: absolute; left: -9999px; opacity: 0; height: 0; width: 0; }

.iletisim-kutu {
  background: var(--beyaz);
  border: 1px solid rgba(176,141,130,.22);
  border-radius: var(--r-l);
  padding: clamp(24px, 2.8vw, 34px);
  display: grid;
  gap: 20px;
}
.iletisim-satir { display: flex; gap: 15px; align-items: flex-start; }
.iletisim-satir .kutu-ikon {
  width: 48px; height: 48px;
  border-radius: 15px;
  display: grid; place-items: center;
  background: linear-gradient(150deg, var(--gul-sis), var(--kagit-2));
  border: 1px solid rgba(181,112,138,.2);
  color: var(--gul-koyu);
  flex: 0 0 auto;
}
.iletisim-satir .ikon { width: 26px; height: 26px; }
.iletisim-satir b { display: block; font-size: .78rem; letter-spacing: .12em; text-transform: uppercase; color: var(--soluk); margin-bottom: 4px; font-weight: 700; }
.iletisim-satir a, .iletisim-satir p { color: var(--murekkep); font-size: .99rem; font-weight: 500; margin: 0; line-height: 1.5; }
.iletisim-satir a:hover { color: var(--gul-koyu); }

.harita {
  border-radius: var(--r-l);
  overflow: hidden;
  box-shadow: var(--golge-m);
  border: 1px solid rgba(176,141,130,.22);
  line-height: 0;
  background: var(--kagit-2);
}
.harita iframe { width: 100%; height: 420px; border: 0; display: block; filter: saturate(.82) contrast(1.02); }

/* Çağrı bandı */
.cagri {
  position: relative;
  overflow: hidden;
  border-radius: var(--r-xl);
  padding: clamp(38px, 5vw, 68px) clamp(26px, 4vw, 62px);
  background: linear-gradient(128deg, var(--erik) 0%, #4A2E3C 58%, #6B4152 100%);
  color: var(--kagit-2);
  display: grid;
  grid-template-columns: 1.25fr .75fr;
  gap: clamp(24px, 3vw, 46px);
  align-items: center;
}
.cagri h2 { color: var(--kagit); font-size: clamp(1.7rem, 3.1vw, 2.6rem); }
.cagri h2 em {
  font-style: normal;
  color: #F0AFC6;
  font-variation-settings: 'SOFT' 60, 'WONK' 1, 'opsz' 90;
}
.cagri p { color: rgba(245,234,228,.82); max-width: 52ch; margin-bottom: 0; }
.cagri__svg { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; opacity: .5; }
.cagri__dugmeler { display: flex; flex-wrap: wrap; gap: 13px; justify-content: flex-end; position: relative; z-index: 1; }
.cagri > div:first-child { position: relative; z-index: 1; }

/* ---------------------------------------------------- 12. Alt bilgi */
.alt {
  background: var(--erik);
  color: rgba(245,234,228,.72);
  padding-top: clamp(52px, 6vw, 80px);
  position: relative;
  overflow: hidden;
}
.alt__desen { position: absolute; left: 50%; top: -60px; translate: -50% 0; width: min(1100px, 130%); opacity: .06; pointer-events: none; }
.alt__ic {
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr 1.2fr;
  gap: clamp(26px, 3vw, 48px);
  padding-bottom: 46px;
}
.alt img.alt__logo { width: 232px; margin-bottom: 22px; }
.alt p { font-size: .94rem; line-height: 1.7; }
.alt h4 {
  color: var(--kagit);
  font-size: .8rem;
  letter-spacing: .16em;
  text-transform: uppercase;
  font-family: 'Karla', sans-serif;
  font-weight: 700;
  margin-bottom: 18px;
}
.alt ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 11px; }
.alt ul a, .alt__ile a {
  font-size: .94rem;
  color: rgba(245,234,228,.72);
  transition: color var(--gecis-h), padding-left var(--gecis-h);
  display: inline-flex; align-items: center; gap: 9px;
}
.alt ul a:hover { color: var(--gul-acik); padding-left: 4px; }
.alt__ile { display: grid; gap: 14px; }
.alt__ile div { display: flex; gap: 12px; align-items: flex-start; font-size: .94rem; }
.alt__ile .ikon { width: 24px; height: 24px; color: var(--gul-acik); flex: 0 0 auto; margin-top: 2px; }
.alt__sosyal { display: flex; gap: 10px; margin-top: 20px; }
.alt__sosyal a {
  width: 42px; height: 42px;
  border-radius: 50%;
  display: grid; place-items: center;
  border: 1px solid rgba(245,234,228,.2);
  color: rgba(245,234,228,.8);
  transition: background var(--gecis-h), color var(--gecis-h), transform var(--gecis-h), border-color var(--gecis-h);
}
.alt__sosyal a:hover { background: var(--gul); border-color: var(--gul); color: #fff; transform: translateY(-3px); }
.alt__sosyal .ikon { width: 20px; height: 20px; }

.alt__son {
  border-top: 1px solid rgba(245,234,228,.13);
  padding-block: 22px;
  display: flex;
  flex-wrap: wrap;
  gap: 12px 26px;
  align-items: center;
  justify-content: space-between;
  font-size: .84rem;
}
.alt__son a:hover { color: var(--gul-acik); }
.alt__uyari {
  font-size: .78rem;
  line-height: 1.6;
  color: rgba(245,234,228,.45);
  padding-bottom: 22px;
  margin: 0;
}

/* Doktor Takvimi rozeti (alt bilgi) */
.alt__dt {
  display: inline-flex;
  align-items: center;
  gap: 13px;
  margin-top: 22px;
  padding: 11px 16px;
  background: rgba(251,246,242,.94);
  border: 1px solid rgba(245,234,228,.2);
  border-radius: var(--r-m);
  transition: transform var(--gecis-h), box-shadow var(--gecis-h);
}
.alt__dt:hover { transform: translateY(-2px); box-shadow: 0 14px 30px -14px rgba(0,0,0,.5); }
.alt__dt img { width: 116px; height: auto; }
.alt__dt div { display: grid; gap: 2px; line-height: 1.2; }
.alt__dt b { font-size: .92rem; color: var(--murekkep); font-weight: 700; }
.alt__dt small { font-size: .7rem; color: var(--soluk); }
.alt__dt .puan-ozet__yildiz { height: 11px; }

/* Alt bardaki ajans imzası */
.alt__ajans {
  display: inline-flex;
  align-items: center;
  opacity: .82;
  transition: opacity var(--gecis-h), transform var(--gecis-h);
}
.alt__ajans img { width: 120px; height: auto; }
.alt__ajans:hover { opacity: 1; transform: translateY(-1px); }

/* Galeri + lightbox */
.galeri { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.galeri figure { margin: 0; position: relative; }
.galeri button {
  display: block;
  width: 100%;
  padding: 0;
  border: 0;
  background: none;
  cursor: zoom-in;
  border-radius: var(--r-m);
  overflow: hidden;
  box-shadow: var(--golge-m);
  position: relative;
  transition: transform var(--gecis), box-shadow var(--gecis);
}
.galeri button img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; transition: transform .7s cubic-bezier(.22,.9,.28,1); }
.galeri button:hover { transform: translateY(-4px); box-shadow: var(--golge-l); }
.galeri button:hover img { transform: scale(1.06); }
.galeri figcaption { margin-top: 10px; font-size: .84rem; color: var(--soluk); }

.lb {
  position: fixed;
  inset: 0;
  z-index: 120;
  display: grid;
  place-items: center;
  padding: 34px 18px;
  background: rgba(30,20,25,.9);
  backdrop-filter: blur(6px);
  opacity: 0;
  visibility: hidden;
  transition: opacity var(--gecis), visibility var(--gecis);
}
.lb.acik { opacity: 1; visibility: visible; }
.lb__ic { margin: 0; max-width: 1000px; max-height: 100%; text-align: center; }
.lb__ic img { max-width: 100%; max-height: 78vh; border-radius: var(--r-m); box-shadow: 0 30px 70px rgba(0,0,0,.5); margin-inline: auto; }
.lb__ic figcaption { color: rgba(245,234,228,.86); font-size: .9rem; margin-top: 16px; }
.lb__kapat, .lb__gez {
  position: absolute;
  border: 1px solid rgba(255,255,255,.24);
  background: rgba(255,255,255,.09);
  color: #fff;
  width: 48px; height: 48px;
  border-radius: 50%;
  cursor: pointer;
  display: grid;
  place-items: center;
  font-size: 1.5rem;
  line-height: 1;
  transition: background var(--gecis-h), transform var(--gecis-h);
}
.lb__kapat { top: 20px; right: 20px; }
.lb__gez svg { width: 22px; height: 22px; }
.lb__gez--onceki  { left: 20px;  top: 50%; margin-top: -24px; }
.lb__gez--sonraki { right: 20px; top: 50%; margin-top: -24px; }
.lb__kapat:hover, .lb__gez:hover { background: rgba(255,255,255,.2); transform: scale(1.08); }

/* ---------------------------------------------- 13. Yüzen düğmeler */
.dock {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 80;
  display: grid;
  gap: 11px;
  justify-items: center;
}
.dock__btn {
  width: 54px; height: 54px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  border: 0;
  cursor: pointer;
  color: #fff;
  box-shadow: var(--golge-l);
  transition: transform var(--gecis-h), box-shadow var(--gecis-h), background var(--gecis-h);
  position: relative;
}
.dock__btn .ikon { width: 27px; height: 27px; }
.dock__btn:hover { transform: scale(1.08) translateY(-2px); }
.dock__btn--wa { background: #25D366; }
.dock__btn--wa::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: 50%;
  border: 2px solid #25D366;
  animation: ik-dalga 2.6s ease-out infinite;
}
.dock__btn--tel { background: linear-gradient(135deg, var(--gul), var(--gul-koyu)); }
.dock__btn--ust {
  background: var(--beyaz);
  color: var(--murekkep);
  border: 1px solid rgba(176,141,130,.3);
  opacity: 0;
  visibility: hidden;
  transform: translateY(10px);
}
.dock__btn--ust.gorunur { opacity: 1; visibility: visible; transform: none; }

/* ------------------------------------------- 14. Hareket / erişim */
.rv {
  opacity: 0;
  transform: translateY(26px);
  transition: opacity .78s cubic-bezier(.22,.9,.28,1), transform .78s cubic-bezier(.22,.9,.28,1);
  will-change: opacity, transform;
}
.rv.in { opacity: 1; transform: none; }
.rv--sol  { transform: translateX(-30px); }
.rv--sag  { transform: translateX(30px); }
.rv--olcek{ transform: scale(.95); }
.rv--sol.in, .rv--sag.in, .rv--olcek.in { transform: none; }

.g1 { transition-delay: .07s }  .g2 { transition-delay: .14s }
.g3 { transition-delay: .21s }  .g4 { transition-delay: .28s }
.g5 { transition-delay: .35s }  .g6 { transition-delay: .42s }

/* Kahraman açılışı */
.hero .ac { opacity: 0; transform: translateY(22px); animation: ac .95s cubic-bezier(.22,.9,.28,1) forwards; }
.hero .ac-1 { animation-delay: .08s } .hero .ac-2 { animation-delay: .18s }
.hero .ac-3 { animation-delay: .28s } .hero .ac-4 { animation-delay: .38s }
.hero .ac-5 { animation-delay: .5s }  .hero .ac-6 { animation-delay: .62s }
@keyframes ac { to { opacity: 1; transform: none } }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
  }
  .rv { opacity: 1; transform: none; }
  .hero .ac { opacity: 1; transform: none; }
}

/* -------------------------------------------- 15. Duyarlı kırılmalar */
@media (max-width: 1100px) {
  .gezinme > a, .acilir__tetik { padding: 9px 10px; font-size: .9rem; }
  .marka img, .ust.yapisik .marka img { width: 172px; }
  .tel-ust span { display: none; }
  .alt__ic { grid-template-columns: 1.4fr 1fr 1.2fr; }
  .alt__ic > div:nth-child(3) { display: none; }
}

@media (max-width: 980px) {
  .gezinme, .ust__eylem .btn, .tel-ust { display: none; }
  .hamburger { display: grid; }
  .hero__ic { grid-template-columns: 1fr; gap: 44px; }
  .sahne { max-width: 460px; margin-inline: auto; width: 100%; }
  .ikili { grid-template-columns: 1fr; gap: 44px; }
  .ikili--ters .ikili__gorsel { order: 0; }
  .izgara--4 { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .izgara--3 { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .iletisim-izgara { grid-template-columns: 1fr; }
  .cagri { grid-template-columns: 1fr; }
  .cagri__dugmeler { justify-content: flex-start; }
  .blm__ust { flex-direction: column; align-items: flex-start; gap: 18px; }
  .adim:not(:last-child)::after { display: none; }
  .gorsel-yigin img.gorsel-yigin__kucuk { width: 44%; right: -3%; }
  .gorus-ray { --gn: 2; }
  .icerik-izgara { grid-template-columns: 1fr; }
  .yan { position: static; grid-template-columns: 1fr 1fr; }
  .yan-kart--cagri { grid-column: 1 / -1; }
}

/* Rozet yalnızca metnin üzerine binmeyecek kadar yer varken görünür */
@media (max-width: 1120px) {
  .sayfabas__rozet { display: none; }
}

@media (max-width: 980px) {
  .sayfabas__ic { grid-template-columns: minmax(0, 1fr) 208px; gap: 30px; }
}

@media (max-width: 760px) {
  .sayfabas__ic { grid-template-columns: minmax(0, 1fr) 158px; gap: 22px; }
  .sayfabas__rozet { display: none; }
}

@media (max-width: 520px) {
  .sayfabas__ic { grid-template-columns: minmax(0, 1fr) 128px; gap: 14px; }
  .sayfabas__svg { left: -44%; top: -28%; width: 188%; height: 148%; }
}

@media (max-width: 860px) {
  .konu { grid-template-columns: 1fr; gap: 22px; }
  .konu__bas {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 2px 18px;
  }
  .konu__ikon { grid-row: 1 / 3; width: 56px; height: 56px; border-radius: 18px; }
  .konu__ikon .ikon { width: 30px; height: 30px; }
  .konu__no { grid-column: 2; margin: 0 0 4px; }
  .konu__bas h2 { grid-column: 2; }
  .konu__ozet { grid-column: 1 / -1; margin-top: 18px; }
}

@media (max-width: 720px) {
  html { scroll-padding-top: 86px; }
  .kap { padding-inline: 18px; }
  .galeri { grid-template-columns: 1fr 1fr; gap: 12px; }
  .yan { grid-template-columns: 1fr; }
  .izgara--3, .izgara--4 { grid-template-columns: 1fr; }
  .izgara--2 { grid-template-columns: 1fr; }
  .sayilar { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .puan-ozet { gap: 12px; padding: 12px 16px; }
  .puan-ozet img { width: 108px; }
  .alanlar { grid-template-columns: 1fr; }
  .alt__ic { grid-template-columns: 1fr; gap: 34px; }
  .alt__ic > div:nth-child(3) { display: block; }
  .alt__son { flex-direction: column; align-items: flex-start; text-align: left; }
  .harita iframe { height: 320px; }
  .gorus-ray { --gn: 1; }
  .gorus-ok { width: 42px; height: 42px; }
  .sahne { max-width: 352px; }
  .sahne__kart { font-size: .76rem; padding: 10px 13px; }
  .sahne__kart--1 { left: -4%; top: 9%; }
  .sahne__kart--2 { right: -4%; top: 47%; }
  .sahne__kart--3 { left: -2%; bottom: 7%; }
  .hero__dugmeler .btn { flex: 1 1 100%; }
  .dock { right: 13px; bottom: 13px; }
  .gorus__tirnak { font-size: 3.4rem; }

  /* Süreç adımları: rozet solda, yazı sağda — dikey yığın yerine satır düzeni */
  .surec .izgara { gap: 26px; }
  .adim {
    display: grid;
    grid-template-columns: 64px minmax(0, 1fr);
    align-items: start;
    gap: 3px 17px;
  }
  .adim__rozet {
    grid-column: 1;
    grid-row: 1 / 3;
    width: 64px; height: 64px;
    margin-bottom: 0;
    box-shadow: 0 0 0 6px var(--kagit), var(--golge-s);
  }
  .adim__rozet .ikon { width: 29px; height: 29px; }
  .adim__no { top: -6px; left: -8px; min-width: 26px; height: 26px; font-size: .72rem; }
  .adim h3 { grid-column: 2; margin-bottom: .3em; }
  .adim p { grid-column: 2; max-width: none; }

  /* Bağlantı çizgisi dikeye döner, rozetin altından sonraki adıma iner */
  .adim:not(:last-child)::after {
    display: block;
    top: 76px;
    left: 31px;
    width: 2px;
    height: calc(100% - 76px + 26px - 6px);
    background: repeating-linear-gradient(180deg, var(--gul-acik) 0 6px, transparent 6px 15px);
    animation: adim-akis-dikey 13s linear infinite;
  }
  @keyframes adim-akis-dikey { to { background-position-y: -63px; } }
}

@media (max-width: 420px) {
  body { font-size: 1rem; }
  .hero__guven { gap: 10px 18px; }
  .hero__guven li { font-size: .82rem; }
}

@media print {
  .ust, .dock, .mnav, .perde, .cagri, .serit { display: none !important; }
  body { background: #fff; }
  body::before { display: none; }
}
