/* ==========================================================================
   Prekast Yapı — Dijital katalog (A4 sayfalar, kitap görünümü)
   Sayfa içi ölçüler sayfa genişliğine göre (cqw) ayarlanır; ekranda ve PDF'te aynı düzen korunur.
   ========================================================================== */

/* ---------- Görüntüleyici ---------- */
.cat-head { padding-bottom: 12px; }
.cat {
  --mark: var(--ice);
  position: relative; color: var(--white); padding: 22px 0 40px;
  background: radial-gradient(120% 90% at 50% 0%, #22436A 0%, var(--navy-deep) 55%, #0A1524 100%);
}
.cat__bar { width: min(100% - 2 * var(--gutter), 1320px); margin: 0 auto 18px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; }
.cat__nav, .cat__tools { display: flex; align-items: center; gap: 8px; }
.cat__btn { width: 44px; height: 44px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid rgba(255, 255, 255, 0.28); background: transparent; color: var(--white); transition: border-color 0.2s var(--ease), background-color 0.2s var(--ease); }
.cat__btn:hover { border-color: var(--white); background: rgba(255, 255, 255, 0.08); }
.cat__btn[disabled] { opacity: 0.35; cursor: default; }
.cat__btn[aria-expanded="true"] { background: var(--white); color: var(--navy); border-color: var(--white); }
.cat__btn svg { width: 20px; height: 20px; }
.cat__count { margin: 0 6px; min-width: 88px; text-align: center; color: var(--ice); font-variant-numeric: tabular-nums; }
.cat__count span { color: var(--white); font-weight: 600; }
.cat-btn { min-height: 44px; padding: 8px 16px; }
.cat-btn svg { width: 18px; height: 18px; }
.cat-btn__meta { font-weight: 400; opacity: 0.7; font-size: 0.85em; }

.cat__stage {
  --bw: min(1240px, calc(100vw - 2 * var(--gutter) - 96px), calc((100vh - 240px) * 1.4142));
  position: relative; display: flex; align-items: center; justify-content: center;
  padding: 6px var(--gutter) 10px; perspective: 2600px; touch-action: pan-y;
}
.cat__stage.is-single { --bw: min(640px, calc(100vw - 2 * var(--gutter)), calc((100vh - 210px) * 0.7071)); }
.book { position: relative; width: var(--bw); aspect-ratio: 420 / 297; transition: transform 0.6s var(--ease); transform-style: preserve-3d; }
.book.is-cover { transform: translateX(-25%); }
.book.is-back { transform: translateX(25%); }
.cat__stage.is-single .book { aspect-ratio: 210 / 297; transform: none; }
.cat__edge { position: absolute; top: 0; bottom: 0; width: max(0px, calc((100% - var(--bw)) / 2)); border: 0; padding: 0; background: transparent; cursor: pointer; }
.cat__edge--prev { left: 0; cursor: w-resize; }
.cat__edge--next { right: 0; cursor: e-resize; }

/* Sayfa */
.cpage {
  position: absolute; top: 0; left: 0; width: 50%; height: 100%; display: none; overflow: hidden;
  container-type: size; background: #FFFFFF; color: var(--graphite);
  box-shadow: 0 26px 60px rgba(0, 0, 0, 0.38); backface-visibility: hidden;
}
.cpage:not(.cpage--cover):not(.cpage--back)::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 0.3cqw; min-height: 2px; background: var(--gold-rule, var(--navy)); z-index: 3; pointer-events: none; }
.cpage.is-left { display: block; left: 0; }
.cpage.is-right { display: block; left: 50%; }
.cat__stage.is-single .cpage { width: 100%; }
.cat__stage.is-single .cpage.is-on { display: block; left: 0; }
.cpage.is-left::after, .cpage.is-right::after { content: ""; position: absolute; top: 0; bottom: 0; width: 7%; z-index: 9; pointer-events: none; }
.cpage.is-left::after { right: 0; background: linear-gradient(90deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.13)); }
.cpage.is-right::after { left: 0; background: linear-gradient(270deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.13)); }

/* Sayfa çevirme: çıkan yaprak sırta doğru katlanır, yenisi diğer yandan açılır */
.cpage.turn-out-r { display: block; left: 50%; z-index: 4; transform-origin: left center; animation: cat-out-r 0.42s cubic-bezier(0.55, 0.05, 0.75, 0.4) forwards; }
.cpage.turn-in-l { display: block; left: 0; z-index: 4; transform-origin: right center; animation: cat-in-l 0.42s cubic-bezier(0.25, 0.6, 0.45, 0.95) both; }
.cpage.turn-out-l { display: block; left: 0; z-index: 4; transform-origin: right center; animation: cat-out-l 0.42s cubic-bezier(0.55, 0.05, 0.75, 0.4) forwards; }
.cpage.turn-in-r { display: block; left: 50%; z-index: 4; transform-origin: left center; animation: cat-in-r 0.42s cubic-bezier(0.25, 0.6, 0.45, 0.95) both; }
@keyframes cat-out-r { from { transform: rotateY(0deg); } to { transform: rotateY(-90deg); filter: brightness(0.72); } }
@keyframes cat-in-l { from { transform: rotateY(90deg); filter: brightness(0.72); } to { transform: rotateY(0deg); filter: none; } }
@keyframes cat-out-l { from { transform: rotateY(0deg); } to { transform: rotateY(90deg); filter: brightness(0.72); } }
@keyframes cat-in-r { from { transform: rotateY(-90deg); filter: brightness(0.72); } to { transform: rotateY(0deg); filter: none; } }
.cat__stage.is-single .cpage.slide-next { animation: cat-slide-next 0.45s var(--ease) both; }
.cat__stage.is-single .cpage.slide-prev { animation: cat-slide-prev 0.45s var(--ease) both; }
@keyframes cat-slide-next { from { opacity: 0; transform: translateX(7%) rotateY(-8deg); } to { opacity: 1; transform: none; } }
@keyframes cat-slide-prev { from { opacity: 0; transform: translateX(-7%) rotateY(8deg); } to { opacity: 1; transform: none; } }

/* Küçük resimler */
.cat__thumbs { width: min(100% - 2 * var(--gutter), 1320px); margin: 18px auto 0; list-style: none; display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 10px; }
.cat__thumbs[hidden] { display: none; }
.cat__thumbs button { all: unset; cursor: pointer; position: relative; display: block; width: 100%; aspect-ratio: 210 / 297; overflow: hidden; background: rgba(255, 255, 255, 0.06); box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.18); }
.cat__thumbs button:focus-visible { outline: 2px solid var(--ice); outline-offset: 3px; }
.cat__thumbs .is-current button { box-shadow: 0 0 0 2px var(--ice); }
.cat__thumbs .cpage { display: block; position: absolute; inset: 0; width: 100%; height: 100%; box-shadow: none; pointer-events: none; }
.cat__thumbs .cpage::after { display: none; }
.cat-thumb__n { position: absolute; left: 4px; bottom: 4px; z-index: 10; padding: 1px 6px; font-size: 0.72rem; background: rgba(10, 21, 36, 0.85); color: var(--white); font-variant-numeric: tabular-nums; }
.cat__hint { margin: 14px var(--gutter) 0; text-align: center; font-size: 0.85rem; color: rgba(255, 255, 255, 0.62); }
.cat:fullscreen { overflow: auto; padding-top: 16px; display: flex; flex-direction: column; justify-content: center; }
.cat:fullscreen .cat__hint { display: none; }

/* JavaScript kapalıysa sayfalar alt alta */
.no-js .cat__stage { display: block; }
.no-js .book { width: min(640px, 100%); aspect-ratio: auto; margin: 0 auto; transform: none; }
.no-js .cpage { display: block; position: relative; width: 100%; height: auto; aspect-ratio: 210 / 297; margin: 0 auto 16px; }
.no-js .cat__nav, .no-js .cat__tools .cat__btn, .no-js .cat__edge { display: none; }

@media (max-width: 1100px) { .cat__thumbs { grid-template-columns: repeat(6, minmax(0, 1fr)); } }
@media (max-width: 600px) {
  .cat__thumbs { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .cat-btn { padding: 8px 12px; }
  .cat-btn__meta { display: none; }
  .cat__stage { padding-inline: 12px; }
  .cat__stage.is-single { --bw: min(640px, calc(100vw - 24px), calc((100vh - 200px) * 0.7071)); }
}
@media (prefers-reduced-motion: reduce) {
  .cpage.turn-out-r, .cpage.turn-in-l, .cpage.turn-out-l, .cpage.turn-in-r, .cat__stage.is-single .cpage.slide-next, .cat__stage.is-single .cpage.slide-prev { animation-duration: 0.01ms !important; }
  .book { transition: none; }
}

/* ---------- Sayfa içerikleri (ölçüler sayfa genişliğine göre) ---------- */
.cpage { font-family: var(--font-text); }
.cpage__in { height: 100%; font-size: 2.01cqw; line-height: 1.5; padding: 6.97cqw 6.15cqw 9.84cqw; }
.cpage p { margin: 0 0 1.8cqw; }
.cpage h3 { font-family: var(--font-display); font-weight: 400; font-size: 2.95cqw; line-height: 1.2; color: var(--navy-deep); margin: 0 0 1.64cqw; }
.cpage figure { margin: 0; }
.cpage img { display: block; width: 100%; object-fit: cover; }
.cp__head { display: flex; align-items: baseline; gap: 2.46cqw; padding-bottom: 2.13cqw; margin-bottom: 4.1cqw; border-bottom: 0.25cqw solid var(--gold, var(--navy)); }
.cp__no { font-weight: 600; font-stretch: 75%; font-size: 2.62cqw; color: var(--steel); letter-spacing: 0.05em; }
.cp__head h2 { font-family: var(--font-display); font-weight: 400; font-size: 5.74cqw; line-height: 1.05; color: var(--navy-deep); margin: 0; }
.cp__lead { font-family: var(--font-display); font-size: 3.07cqw; line-height: 1.38; color: var(--navy-deep); margin: 0 0 4.1cqw; }
.cp__cols { columns: 2; column-gap: 4.1cqw; color: var(--mold); font-size: 2.01cqw; margin-bottom: 3.28cqw; }
.cpage .cp__fig { position: relative; margin-bottom: 3.28cqw; }
.cp__fig--wide img { height: 52cqw; }
.cp__fig--tall img { height: 58cqw; }
.cp__fig--hero img { height: 69cqw; }
.cp__fig figcaption { font-size: 1.48cqw; color: var(--mold); margin-top: 0.98cqw; }
.cp__badge { position: absolute; left: 1.97cqw; top: 1.97cqw; padding: 0.82cqw 1.8cqw; font-size: 1.64cqw; background: var(--navy); color: var(--white); }
.cp__facts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0; border-top: 0.2cqw solid var(--gold, var(--navy)); }
.cp__facts div { padding: 1.97cqw 1.64cqw 0 0; }
.cp__facts dt { font-size: 1.72cqw; color: var(--mold); }
.cp__facts dd { margin: 0.49cqw 0 0; font-size: 4.1cqw; font-weight: 600; font-stretch: 80%; line-height: 1.1; color: var(--navy); }
.cp__facts--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.cp__facts--2 div { padding-bottom: 1.64cqw; border-bottom: 0.16cqw solid var(--mist-2); }
.cp__facts--2 dd { font-size: 2.46cqw; }
.cp__time { list-style: none; padding: 0; margin: 0 0 4.92cqw; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2.46cqw; border-top: 0.2cqw solid var(--gold, var(--ice)); }
.cp__time li { position: relative; padding-top: 2.3cqw; }
.cp__time li::before { content: ""; position: absolute; top: -0.82cqw; left: 0; width: 1.48cqw; height: 1.48cqw; background: var(--navy); }
.cp__time b { display: block; font-size: 5.74cqw; font-stretch: 75%; line-height: 1; color: var(--navy); }
.cp__time span { display: block; font-family: var(--font-display); font-size: 2.54cqw; margin: 0.98cqw 0; color: var(--navy-deep); }
.cp__time p { font-size: 1.84cqw; color: var(--mold); }
.cp__two { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4.1cqw; margin-bottom: 4.1cqw; }
.cp__ticks { list-style: none; padding: 0; margin: 0; display: grid; gap: 1.23cqw; font-size: 1.93cqw; }
.cp__ticks li { position: relative; padding-left: 2.46cqw; }
.cp__ticks li::before { content: ""; position: absolute; left: 0; top: 0.86cqw; width: 0.98cqw; height: 0.98cqw; background: var(--navy-mid); }
.cp__ticks--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 3.28cqw; }
.cp__values { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 1.31cqw; }
.cp__values li { padding: 1.15cqw 2.13cqw; font-size: 1.8cqw; color: var(--navy); background: var(--mist); border-left: 0.41cqw solid var(--gold, var(--navy)); }
.cp__serv { display: grid; grid-template-columns: 42% minmax(0, 1fr); gap: 3.28cqw; align-items: center; padding: 2.79cqw 0; border-top: 0.16cqw solid var(--mist-2); }
.cp__serv img { height: 27.5cqw; }
.cp__idx { font-size: 1.64cqw; font-weight: 600; letter-spacing: 0.08em; color: var(--steel); }
.cp__serv h3 { font-size: 3.53cqw; margin: 0.49cqw 0 1.15cqw; }
.cp__serv p { font-size: 1.97cqw; color: var(--mold); margin: 0; }
.cp__split { display: grid; grid-template-columns: minmax(0, 1fr) 22.96cqw; gap: 4.1cqw; align-items: end; }
.cp__qr, .bk__qr { display: flex; flex-direction: column; align-items: center; gap: 1.15cqw; text-align: center; text-decoration: none; font-size: 1.56cqw; line-height: 1.3; }
.cp__qr { color: var(--navy-deep); }
.cp__qr .qr { width: 18.04cqw; height: 18.04cqw; padding: 1.31cqw; color: var(--navy-deep); background: var(--white); border: 0.2cqw solid var(--mist-2); }
.cp__grid4 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.31cqw; margin-bottom: 3.69cqw; }
.cp__grid4 img { height: 41cqw; }
.cp__grid4--row { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.cp__grid4--row img { height: 22cqw; }
.cp__note { font-size: 1.56cqw; color: var(--mold); margin-top: 2.87cqw; }
.cp__strip { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.31cqw; margin-bottom: 3.69cqw; }
.cp__strip img { height: 66cqw; }
.cp__strip--sm img { height: 29.52cqw; }
.cp__three { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 3.28cqw; }
.cp__three .cp__ticks { font-size: 1.84cqw; }
.cp__list { list-style: none; padding: 0; margin: 0; counter-reset: cpl; border-top: 0.16cqw solid var(--mist-2); }
.cp__list li { counter-increment: cpl; position: relative; padding: 1.31cqw 0 1.31cqw 4.92cqw; border-bottom: 0.16cqw solid var(--mist-2); font-family: var(--font-display); font-size: 2.25cqw; line-height: 1.3; color: var(--navy-deep); }
.cp__list li::before { content: counter(cpl, decimal-leading-zero); position: absolute; left: 0; top: 1.56cqw; font-family: var(--font-text); font-size: 1.48cqw; font-weight: 600; color: var(--steel); }
.cp__list--2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 3.28cqw; margin-bottom: 3.28cqw; }
.cp__grid9 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.97cqw 1.31cqw; }
.cp__grid9 img { height: 24cqw; }
.cp__grid9 figcaption { margin-top: 0.98cqw; font-family: var(--font-display); font-size: 1.84cqw; line-height: 1.25; color: var(--navy-deep); }
.cp__grid9 figcaption span { display: block; margin-bottom: 0.33cqw; font-family: var(--font-text); font-size: 1.31cqw; font-weight: 600; color: var(--navy-mid); }
.cp__dl { margin: 0; }
.cp__dl div { padding: 1.15cqw 0; border-bottom: 0.16cqw solid var(--mist-2); }
.cp__dl dt { font-size: 1.89cqw; font-weight: 600; color: var(--navy); }
.cp__dl dd { margin: 0.25cqw 0 0; font-size: 1.8cqw; color: var(--mold); }
.cp__band img { height: 33cqw; }
.cp__band { margin-top: 0.82cqw; }
.cp__collage { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.31cqw; }
.cp__collage img { height: 39.5cqw; }
.cp__foot { position: absolute; left: 6.15cqw; right: 6.15cqw; bottom: 3.69cqw; display: flex; justify-content: space-between; align-items: center; padding-top: 1.31cqw; font-size: 1.52cqw; color: var(--mold); border-top: 0.16cqw solid var(--mist-2); }
.cp__pg { font-weight: 600; color: var(--gold-deep, var(--navy)); }

/* Kapak */
.cpage--cover { background: var(--navy-deep); color: var(--white); }
.cpage--cover .cpage__in { padding: 0; }
.cv__img { position: absolute; inset: 0 0 34% 0; overflow: hidden; background: var(--navy-deep); }
.cv__img img { height: 100%; object-position: 38% 50%; clip-path: polygon(0% 100%, 0% 0%, 32.6% 0%, 32.6% 100%, 33.7% 100%, 33.7% 0%, 66.3% 0%, 66.3% 100%, 67.4% 100%, 67.4% 0%, 100% 0%, 100% 100%); }
.cv__img span { display: none; }
.cv__img::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(17, 34, 55, 0.6) 0%, rgba(17, 34, 55, 0) 28%, rgba(17, 34, 55, 0) 72%, rgba(17, 34, 55, 0.92) 100%); }
.cv__top { position: absolute; z-index: 2; top: 6cqw; left: 7.5cqw; right: 7.5cqw; display: flex; align-items: center; gap: 2.13cqw; font-family: var(--font-display); font-size: 4.4cqw; line-height: 1.1; }
.cv__top img { width: 6.8cqw; height: auto; }
.cv__top small { display: block; margin-top: 0.49cqw; font-family: var(--font-text); font-size: 1.39cqw; letter-spacing: 0.06em; opacity: 0.85; }
.cv__band { position: absolute; left: 0; right: 0; bottom: 0; height: 36%; padding: 7cqw 7.5cqw; background: linear-gradient(180deg, var(--navy-deep) 0%, #0A1524 100%); box-shadow: inset 0 0.2cqw 0 var(--gold, transparent); }
.cv__kicker { display: flex; align-items: center; gap: 1.97cqw; margin: 0 0 2.46cqw; font-size: 1.9cqw; letter-spacing: 0.2em; text-transform: uppercase; color: var(--gold-soft, var(--ice)); }
.cv__kicker::before { content: ""; width: 6.56cqw; height: 0.2cqw; background: var(--gold, var(--ice)); }
.cv__title { margin: 0 0 2.46cqw; font-family: var(--font-display); font-weight: 400; font-size: 8.6cqw; line-height: 1.04; color: var(--white); }
.cv__sub { margin: 0; font-size: 2.3cqw; color: rgba(255, 255, 255, 0.8); }

/* Arka kapak */
.cpage--back .cpage__in { padding: 7.38cqw 6.15cqw; }
.cpage--back { color: var(--white); background: linear-gradient(170deg, var(--navy) 0%, var(--navy-deep) 55%, #0A1524 100%); }
.bk__top { display: flex; align-items: center; gap: 2.46cqw; font-family: var(--font-display); font-size: 4.26cqw; line-height: 1.1; }
.bk__top img { width: 8.2cqw; height: auto; }
.bk__top p { margin: 0; }
.bk__top small { display: block; margin-top: 0.66cqw; font-family: var(--font-text); font-size: 1.56cqw; letter-spacing: 0.06em; color: var(--ice); }
.bk__body { margin-top: 11.48cqw; display: grid; grid-template-columns: minmax(0, 1fr) 22.96cqw; gap: 2.46cqw 4.1cqw; align-items: end; }
.bk__body h2 { grid-column: 1 / -1; margin: 0; padding-bottom: 1.97cqw; font-family: var(--font-display); font-weight: 400; font-size: 5.08cqw; color: var(--white); border-bottom: 0.2cqw solid rgba(255, 255, 255, 0.25); }
.bk__body dl { margin: 0; }
.bk__body dl div { padding: 1.31cqw 0; border-bottom: 0.16cqw solid rgba(255, 255, 255, 0.12); }
.bk__body dt { font-size: 1.48cqw; color: var(--ice); }
.bk__body dd { margin: 0.33cqw 0 0; font-size: 2.13cqw; }
.bk__qr { color: var(--white); }
.bk__qr .qr { width: 18.04cqw; height: 18.04cqw; padding: 1.48cqw; color: var(--navy-deep); background: var(--white); }
.bk__foot { position: absolute; left: 6.15cqw; right: 6.15cqw; bottom: 4.92cqw; display: flex; align-items: center; gap: 2.46cqw; padding-top: 1.97cqw; font-size: 1.39cqw; color: rgba(255, 255, 255, 0.72); border-top: 0.16cqw solid rgba(222, 198, 144, 0.35); }
.bk__foot p { margin: 0; flex: 1; }
.bk__iso { width: 7.38cqw !important; height: auto; padding: 0.49cqw; background: var(--white); object-fit: contain !important; }
.bk__asd img { width: 5.74cqw; height: auto; opacity: 0.88; }

/* ---------- Yazdırma ve PDF (her sayfa bir A4) ---------- */
@media print {
  @page { size: A4; margin: 0; }
  html, body { background: #FFFFFF !important; }
  .site-header, .drawer, .site-footer, .wa-float, .modal, .lightbox, .skip-link, .cat-head, .cta-band, .cat__bar, .cat__thumbs, .cat__hint, .cat__edge { display: none !important; }
  main > *:not(.cat) { display: none !important; }
  .cat { padding: 0; background: none; }
  .cat__stage { display: block; padding: 0; perspective: none; }
  .book { width: auto !important; aspect-ratio: auto; transform: none !important; }
  .cpage { display: block !important; position: relative !important; left: auto !important; width: 210mm !important; height: 297mm !important; box-shadow: none; break-after: page; page-break-after: always; animation: none !important; transform: none !important; filter: none !important; }
  .cpage:last-child { break-after: auto; page-break-after: auto; }
  .cpage::after { display: none !important; }
  * { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}

/* Kapak ve arka kapakta kurumsal kimlikteki yatay logo */
.cv__top img { width: auto; height: 10cqw; }
.bk__top img { width: auto; height: 10cqw; }
.cv__img::after { background: linear-gradient(180deg, rgba(17, 34, 55, 0.82) 0%, rgba(17, 34, 55, 0.38) 22%, rgba(17, 34, 55, 0) 36%, rgba(17, 34, 55, 0) 72%, rgba(17, 34, 55, 0.92) 100%); }
