/* 5 Kas: ana sayfa üst vitrin — fareyle açılan hizmet panelleri, arkada yavaş yaklaşan fotoğraf + altın toz + ışık süzülmesi. */
.vitrin { position: relative; background: var(--laci-koyu); color: #dbe4f6; overflow: hidden; isolation: isolate; }
.vitrin-ic { display: flex; height: clamp(600px, calc(100vh - 88px), 780px); }
.vitrin-toz { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 3; pointer-events: none; mix-blend-mode: screen; }

.vp { --renk: 11, 23, 54; position: relative; flex: 1 1 0; min-width: 0; overflow: hidden; display: block; color: inherit; text-decoration: none; outline: none;
  border-left: 1px solid rgba(184,151,90,.28); transition: flex-grow 1.05s var(--hiz); }
.vp:first-child { border-left: 0; }
.vp.acik { flex-grow: 4.2; }
.vp-alt { list-style: none; margin: -8px 0 30px; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 10px 26px; max-width: 560px; }
.vp-alt li { position: relative; padding-left: 18px; color: #e3e9f6; font-size: .98rem; line-height: 1.5; }
.vp-alt li::before { content: ""; position: absolute; left: 0; top: .6em; width: 6px; height: 6px; background: var(--altin); transform: rotate(45deg); }
.vp::before { content: ""; position: absolute; inset: -4%; z-index: 0; background: var(--g) center / cover no-repeat;
  filter: saturate(.85) brightness(.85); transform: scale(1.08); transition: filter 1.2s, transform 2.4s var(--hiz); animation: vp-nefes 26s ease-in-out infinite alternate; }
.vp:nth-child(2)::before { animation-delay: -6s; } .vp:nth-child(3)::before { animation-delay: -11s; }
.vp:nth-child(4)::before { animation-delay: -15s; } .vp:nth-child(5)::before { animation-delay: -19s; } .vp:nth-child(6)::before { animation-delay: -23s; }
@keyframes vp-nefes { from { transform: scale(1.06) translate(0, 0); } to { transform: scale(1.16) translate(-2%, -1.5%); } }
/* her panelin kendi kurumsal tonu: lacivert, petrol, bordo-lacivert, mürekkep, bronz */
.vp:nth-child(2) { --renk: 14, 52, 72; } .vp:nth-child(3) { --renk: 38, 20, 52; } .vp:nth-child(4) { --renk: 20, 30, 70; }
.vp:nth-child(5) { --renk: 52, 38, 18; } .vp:nth-child(6) { --renk: 10, 42, 60; }
.vp::after { content: ""; position: absolute; inset: 0; z-index: 1; transition: opacity 1s;
  background: linear-gradient(180deg, rgba(var(--renk), .78) 0%, rgba(var(--renk), .9) 55%, rgba(6,12,30,.96) 100%); }
.vp.acik::before { filter: saturate(1) brightness(.95); }
.vp.acik::after { background: linear-gradient(90deg, rgba(8,16,40,.94) 0%, rgba(8,16,40,.82) 42%, rgba(var(--renk), .35) 78%, rgba(var(--renk), .45) 100%),
  linear-gradient(0deg, rgba(6,12,30,.7) 0%, transparent 40%); }
/* kapalı panelde ışık süzülmesi */
/* kapalı şeritte düz okunan ad: üstte altın Roma rakamı + ince çizgi, altta ad */
.vp-etiket { position: absolute; left: clamp(16px, 1.6vw, 26px); right: clamp(12px, 1.2vw, 20px); bottom: 54px; z-index: 2;
  display: flex; flex-direction: column; align-items: flex-start; gap: 16px; font-family: var(--serif); font-weight: 500;
  font-size: clamp(1.02rem, 1.35vw, 1.3rem); line-height: 1.25; color: rgba(255,255,255,.9); hyphens: auto; overflow-wrap: break-word;
  transition: opacity .5s, transform .8s var(--hiz); }
.vp-etiket i { font-style: normal; font-size: 1.5em; line-height: 1; color: var(--altin); padding-bottom: 14px; position: relative; }
.vp-etiket i::after { content: ""; position: absolute; left: 0; bottom: 0; width: 28px; height: 1px; background: var(--altin); transition: width .6s var(--hiz); }
.vp:hover .vp-etiket, .vp:focus-visible .vp-etiket { color: #fff; }
.vp:hover .vp-etiket i::after { width: 48px; }
.vp.acik .vp-etiket { opacity: 0; transform: translateY(-24px); }
.vp-giris .vp-etiket { font-size: clamp(1.1rem, 1.5vw, 1.4rem); letter-spacing: .3em; color: var(--altin); }

.vp-icerik { position: absolute; left: clamp(28px, 4.5vw, 72px); bottom: clamp(40px, 7vh, 80px); z-index: 2; width: min(620px, 74%); opacity: 0; transform: translateY(26px);
  transition: opacity .45s, transform .7s var(--hiz); pointer-events: none; }
.vp.acik .vp-icerik { opacity: 1; transform: none; transition: opacity .8s .45s, transform 1s .45s var(--hiz); pointer-events: auto; }
.vp-icerik .ust-baslik { color: var(--altin); }
.vp-icerik h1, .vp-icerik h2 { color: #fff; font-family: var(--serif); font-weight: 500; line-height: 1.12; margin: 0 0 .5em; }
.vp-icerik h1 { font-size: clamp(2.3rem, 4.2vw, 3.9rem); }
.vp-icerik h1 em { color: var(--altin); font-style: italic; }
.vp-icerik h2 { font-size: clamp(2rem, 3.4vw, 3.1rem); position: relative; padding-bottom: 22px; }
.vp-icerik h2::after { content: ""; position: absolute; left: 0; bottom: 0; width: 64px; height: 2px; background: var(--altin); transform-origin: 0 50%; transform: scaleX(0); transition: transform 1s .9s var(--hiz); }
.vp.acik .vp-icerik h2::after { transform: scaleX(1); }
.vp-icerik p { font-size: 1.02rem; line-height: 1.75; color: #c9d3ea; margin: 0 0 30px; max-width: 560px; }
.vp-icerik .dugmeler { display: flex; flex-wrap: wrap; align-items: center; gap: 26px; }
.vp-icerik .bag-ok { color: #fff; }
.vp-icerik .bag-ok:hover { color: var(--altin); }
.btn-altin { background: var(--altin); color: var(--laci-koyu); }
.btn-altin:hover { background: #fff; color: var(--laci-koyu); }
.btn-cizgi-acik { border: 1px solid rgba(255,255,255,.75); color: #fff; background: transparent; min-height: 46px; border-radius: 999px; padding: 0 30px; font-size: .78rem; letter-spacing: .14em; text-transform: uppercase; }
.vp:hover .btn-cizgi-acik { background: #fff; color: var(--laci-koyu); border-color: #fff; }
.vp-imza { display: flex; align-items: center; gap: 16px; margin-top: 38px; }
.vp-imza .cizgi { width: 46px; height: 1px; background: var(--altin); }
.vp-imza b { display: block; font-family: var(--serif); font-weight: 500; font-size: 1.2rem; color: #fff; }
.vp-imza small { color: var(--altin); font-size: .78rem; letter-spacing: .08em; }

/* açık panelin üstünde ince altın çerçeve köşeleri */
.vp.acik .vp-icerik::before { content: ""; position: absolute; left: -22px; top: -26px; width: 34px; height: 34px; border-left: 1px solid var(--altin); border-top: 1px solid var(--altin); opacity: .8; }

@media (max-width: 900px) {
  .vitrin-ic { flex-direction: column; height: auto; }
  .vp { flex: none; border-left: 0; border-top: 1px solid rgba(184,151,90,.3); min-height: 132px; }
  .vp.acik { flex: none; }
  .vp-giris { min-height: 620px; }
  .vp-giris .vp-etiket { display: none; }
  .vp:not(.vp-giris) .vp-etiket { flex-direction: row; align-items: center; transform: none; left: 24px; bottom: auto; top: 24px; font-family: var(--sans); font-size: .95rem; letter-spacing: .2em; text-transform: uppercase; gap: 14px; opacity: 1; }
  .vp:not(.vp-giris) .vp-etiket i { padding: 0; font-family: var(--serif); letter-spacing: 0; }
  .vp:not(.vp-giris) .vp-etiket i::after { display: none; }
  .vp:not(.vp-giris) .vp-icerik { display: none; }
  .vp:not(.vp-giris)::after { background: linear-gradient(90deg, rgba(var(--renk), .92), rgba(var(--renk), .6)); }
  .vp:not(.vp-giris)::before { filter: saturate(.9) brightness(.9); }
  .vp:not(.vp-giris) { display: flex; align-items: flex-end; }
  .vp:not(.vp-giris)::marker { content: none; }
  .vp-giris .vp-icerik { position: relative; left: auto; bottom: auto; opacity: 1; transform: none; pointer-events: auto; width: auto; padding: 64px 24px 56px; }
  .vp-giris { min-height: 0; }
  .vp.acik .vp-icerik::before { left: 14px; top: 40px; }
}
@media (prefers-reduced-motion: reduce) { .vp::before { animation: none; } .vp, .vp-icerik, .vp-etiket { transition: none; } }

/* yaklaşım bölümü (ana sayfa) */
.yaklasim-izgara { display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(36px, 6vw, 96px); align-items: start; }
.yaklasim-sol h2 { font-size: clamp(1.9rem, 3.2vw, 2.8rem); margin-bottom: 28px; }
.yaklasim-sol h2 em { color: var(--altin-koyu); }
.yaklasim-sag p { font-size: 1.05rem; line-height: 1.85; color: var(--metin-2); margin: 0 0 1.2em; padding-left: 28px; border-left: 1px solid var(--cizgi); position: relative; }
.yaklasim-sag p::before { content: ""; position: absolute; left: -4px; top: .7em; width: 7px; height: 7px; background: var(--altin); transform: rotate(45deg); }
@media (max-width: 860px) { .yaklasim-izgara { grid-template-columns: 1fr; } }

/* SSS */
.sss-izgara { display: grid; grid-template-columns: .7fr 1.3fr; gap: clamp(30px, 5vw, 80px); align-items: start; }
.sss-liste { border-top: 1px solid var(--laci); }
.sss-s { border-bottom: 1px solid var(--cizgi); }
.sss-s summary { list-style: none; cursor: pointer; display: grid; grid-template-columns: 44px 1fr 26px; gap: 14px; align-items: center; padding: 24px 0;
  font-family: var(--serif); font-size: clamp(1.05rem, 1.6vw, 1.25rem); color: var(--laci); transition: color .3s; }
.sss-s summary::-webkit-details-marker { display: none; }
.sss-s summary .sira { font-family: var(--serif); color: var(--altin-koyu); font-size: .95rem; }
.sss-s summary i { position: relative; width: 22px; height: 22px; border: 1px solid var(--altin); border-radius: 50%; }
.sss-s summary i::before, .sss-s summary i::after { content: ""; position: absolute; left: 50%; top: 50%; width: 9px; height: 1px; background: var(--laci); transform: translate(-50%, -50%); transition: transform .4s var(--hiz); }
.sss-s summary i::after { transform: translate(-50%, -50%) rotate(90deg); }
.sss-s[open] summary i::after { transform: translate(-50%, -50%) rotate(0); }
.sss-s summary:hover { color: var(--altin-koyu); }
.sss-s > div { padding: 0 40px 26px 58px; }
.sss-s > div p { margin: 0; line-height: 1.8; color: var(--metin-2); }
.sss-s[open] > div { animation: sss-ac .5s var(--hiz); }
@keyframes sss-ac { from { opacity: 0; transform: translateY(-6px); } }
@media (max-width: 860px) { .sss-izgara { grid-template-columns: 1fr; } .sss-s > div { padding: 0 0 22px 58px; } }

/* hakkımızda: 5 değer + profil */
.degerler-5 { grid-template-columns: repeat(5, 1fr); }
.degerler-5 .deger h3 { font-size: 1.15rem; }
@media (max-width: 1100px) { .degerler-5 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 860px) { .degerler-5 { grid-template-columns: 1fr; } }
.profil { background: var(--laci) url("img/dalga.svg"); color: #c9d3ea; }
.profil-izgara { display: grid; grid-template-columns: .85fr 1.15fr; gap: clamp(36px, 6vw, 90px); align-items: start; }
.profil .ust-baslik { color: var(--altin); }
.profil h2 { color: #fff; font-size: clamp(2.2rem, 4vw, 3.2rem); margin-bottom: 10px; }
.profil-unvan { font-family: var(--serif); font-size: 1.2rem; line-height: 1.5; color: var(--altin); margin: 0 0 30px; }
.profil-bilgi { list-style: none; margin: 0 0 34px; padding: 0; border-top: 1px solid rgba(184,151,90,.35); }
.profil-bilgi li { padding: 14px 0; border-bottom: 1px solid rgba(184,151,90,.2); font-size: .95rem; color: #fff; }
.profil-bilgi small { display: block; font-size: .68rem; letter-spacing: .18em; text-transform: uppercase; color: var(--altin); margin-bottom: 4px; }
.profil blockquote { margin: 0; padding: 26px 0 0 26px; border-left: 1px solid var(--altin); font-family: var(--serif); font-size: 1.15rem; line-height: 1.6; color: #fff; font-style: italic; }
.profil-sag p { line-height: 1.9; margin: 0 0 1.2em; }
.profil-sag p:first-child { font-family: var(--serif); font-size: 1.35rem; line-height: 1.6; color: #fff; }
@media (max-width: 860px) { .profil-izgara { grid-template-columns: 1fr; } }

/* iletişim kişi kartı, alt bilgi sloganı */
.ilet-kisi { padding-bottom: 18px; margin-bottom: 8px; border-bottom: 1px solid rgba(184,151,90,.35); }
.ilet-kisi b { display: block; font-family: var(--serif); font-weight: 500; font-size: 1.35rem; }
.ilet-kisi small { color: var(--altin); font-size: .8rem; letter-spacing: .06em; }
.alt-slogan { margin: 18px 0 0; font-size: .88rem; line-height: 1.6; max-width: 280px; opacity: .8; }

/* hizmet grupları: liste sayfası, yan menü, üst menü */
.hz-grup { display: flex; align-items: center; gap: 18px; font-family: var(--sans); font-size: .78rem; font-weight: 700; letter-spacing: .22em; text-transform: uppercase; color: var(--altin-koyu); margin: 0 0 26px; scroll-margin-top: 110px; }
.hz-grup::after { content: ""; flex: 1; height: 1px; background: var(--cizgi); }
.hzk-izgara + .hz-grup { margin-top: 70px; }
.yan-grup { display: block; font-size: .66rem; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: var(--altin-koyu); margin: 12px 0 2px 4px; }
.yan-grup:first-child { margin-top: 0; }
.acilir-grup { display: block; font-size: .62rem; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: var(--altin-koyu); padding: 10px 14px 4px; }
.acilir-liste a { padding-top: 8px; padding-bottom: 8px; }
.hzd-ara { margin: 34px 0 0; padding: 26px 30px; border: 1px solid var(--cizgi); border-left: 3px solid var(--altin); background: rgba(255,255,255,.6); border-radius: 0 8px 8px 0; }
.hzd-ara h3 { margin: 0 0 8px; font-family: var(--serif); font-weight: 500; color: var(--laci); }
.hzd-ara p { margin: 0; line-height: 1.8; }
.hzd-kimler p + p { margin-top: .8em; }
.hzd-kimler + .hzd-h { margin-top: 70px; }
