/* --- main topic content --- */
.topic-main-wrap{background:#e5edf1;padding:34px 0 66px}
.topic-main{background:#fff;padding-block:54px 64px}
.topic-intro{max-width:980px;margin:0 auto 42px}.topic-eyebrow{color:var(--piaq-teal);font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;margin:0 0 8px}.topic-intro h2{font-size:clamp(26px,3vw,36px);line-height:1.2;color:var(--piaq-navy-dark);margin:0 0 18px;font-weight:600}.topic-intro p{margin:0 0 16px;color:#456170}.topic-intro p:last-child{margin-bottom:0}
.topic-highlight{display:grid;grid-template-columns:64px minmax(0,1fr);gap:22px;align-items:start;background:#e7eff2;padding:28px 32px;margin:0 auto 44px;max-width:1100px;border-left:4px solid var(--piaq-teal)}.topic-highlight-icon{width:58px;height:58px;display:grid;place-items:center;background:#fff;color:var(--piaq-teal);font-size:27px;box-shadow:0 5px 18px rgba(10,48,65,.07)}.topic-highlight h3{font-size:22px;line-height:1.3;margin:0 0 8px;color:var(--piaq-navy-dark);font-weight:600}.topic-highlight p{margin:0;color:#456170}
.topic-section-head{text-align:center;max-width:760px;margin:0 auto 28px}.topic-section-head h2{font-size:clamp(25px,3vw,34px);line-height:1.2;margin:0 0 10px;font-weight:600;color:var(--piaq-navy-dark)}.topic-section-head p{margin:0;color:var(--piaq-muted)}.topic-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-bottom:58px}.topic-card{background:#fff;border:1px solid var(--piaq-border);box-shadow:0 10px 28px rgba(16,55,72,.06);padding:28px 26px;min-height:220px;transition:transform .2s ease,box-shadow .2s ease}.topic-card:hover{transform:translateY(-3px);box-shadow:0 15px 34px rgba(16,55,72,.1)}.topic-card-icon{width:48px;height:48px;display:grid;place-items:center;background:#e7f2f4;color:var(--piaq-navy);font-size:23px;margin-bottom:18px}.topic-card h3{font-size:21px;line-height:1.3;margin:0 0 9px;font-weight:600;color:var(--piaq-navy-dark)}.topic-card p{margin:0;color:var(--piaq-muted);font-size:16px}
.topic-points{background:#e7eff2;padding:34px clamp(22px,4vw,52px);margin-bottom:56px}.topic-points h2{font-size:28px;margin:0 0 22px;color:var(--piaq-navy-dark);font-weight:600}.topic-points-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 32px}.topic-point{display:grid;grid-template-columns:30px minmax(0,1fr);gap:12px;align-items:start;color:#24536a}.topic-point i{display:grid;place-items:center;width:27px;height:27px;border-radius:50%;background:var(--piaq-teal);color:#fff;font-size:14px;margin-top:2px}.topic-point strong{font-weight:600;color:var(--piaq-navy-dark)}
.topic-cta{display:flex;align-items:center;justify-content:space-between;gap:28px;background:var(--piaq-navy);color:#fff;padding:32px clamp(24px,4vw,48px)}.topic-cta h2{font-size:26px;line-height:1.25;margin:0 0 7px;font-weight:600}.topic-cta p{margin:0;color:#d7e7ee}
.topic-cta a{
flex-shrink:0;display:inline-flex;align-items:center;gap:10px;background:#f6f8fa;color:#102653;text-decoration:none;padding:13px 20px;font-weight:600;transition:background .2s


 

}

.topic-cta a:hover{background:#00766f}
@media(max-width:850px){.topic-banner-inner{grid-template-columns:minmax(0,1fr) 34%;gap:18px}.topic-banner-visual{min-height:260px}.topic-visual-panel{right:8%;width:84%;padding:18px}.topic-visual-panel strong{font-size:17px}.topic-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.topic-points-grid{grid-template-columns:1fr}.topic-cta{align-items:flex-start;flex-direction:column}}
@media(max-width:560px){:root{--piaq-content-padding:20px}.topic-banner,.topic-banner-inner{min-height:0}.topic-banner-inner{display:block;padding-block:0}.topic-banner-copy{padding-block:28px}.topic-banner-visual{min-height:175px;margin-inline:calc(-1 * var(--piaq-content-padding))}.topic-visual-panel{right:8%;width:76%;padding:15px}.topic-visual-panel .bi{font-size:23px;margin-bottom:8px}.topic-visual-panel strong{font-size:16px}.topic-visual-panel span{font-size:12px}.topic-main-wrap{padding:18px 0 36px}.topic-main{padding-block:32px 38px}.topic-highlight{grid-template-columns:1fr;padding:24px;gap:14px}.topic-cards{grid-template-columns:1fr;gap:15px;margin-bottom:40px}.topic-card{min-height:0;padding:23px}.topic-points{padding:25px 20px;margin-bottom:40px}.topic-points h2{font-size:24px}.topic-cta{padding:26px 22px}.topic-cta h2{font-size:23px}}

  .page-stage { position:relative; isolation:isolate; padding:0 0 54px; background:#e5edf0; overflow:hidden; }
    /* Sol renk efekti tüm sayfa gövdesine yayılır; ince bir şerit değildir. */
    .page-stage::before { content:""; position:absolute; z-index:-1; left:0; top:0; width:clamp(300px, 42vw, 650px); height:100%; background:linear-gradient(to bottom, #92979a 0, #92979a 31%, #4f9ec8 31%, #4f9ec8 43%, #e5edf0 43%, #e5edf0 100%); }
    .page-stage::after { content:""; position:absolute; z-index:-1; left:0; top:0; width:clamp(180px, 30vw, 460px); height:100%; background:linear-gradient(to bottom, transparent 0, transparent 31%, #337fa8 31%, #337fa8 43%, transparent 43%); }
    .photo-subheader { width:calc(100% - 2 * var(--piaq-content-padding)); max-width:var(--piaq-content-max-width); margin:0 auto; height:clamp(180px, 22vw, 200px); background:#dce8ec; overflow:hidden; }
    .photo-subheader img { width:100%; height:100%; object-fit:cover; object-position:center 48%; display:block; }
    .page-content-wrap { width:100%; max-width:var(--piaq-content-max-width); margin:0 auto; padding:0 var(--piaq-content-padding); }
    .page-content { background:#f9fbfc; min-height:350px; margin-top:0; padding:clamp(36px,5vw,70px) clamp(24px, 8vw, 130px) clamp(46px,6vw,85px); box-shadow:0 14px 34px rgba(18,53,70,.08); }
    .page-content h1 { text-align:center; color:#111; font-size:clamp(24px,2.2vw,32px); line-height:1.3; font-weight:700; margin:0 0 46px; }
    .page-content p { color:#152f3e; font-size:16px; line-height:1.7; margin:0 0 24px; }
    .page-content p:last-child { margin-bottom:0; }
    .site-footer { position:relative; z-index:1; }
    @media(max-width:767px) {
      .page-stage { padding-bottom:30px; }
      .page-stage::before { width:75vw; }
      .page-stage::after { width:52vw; }
      .photo-subheader { width:100%; height:170px; }
      .page-content-wrap { padding-inline:12px; }
      .page-content { padding:34px 22px 40px; }
      .page-content h1 { margin-bottom:28px; }
	  .photo-subheader::after {display:none}
	   .photo-subheader::before {display:none}
    }
 
  .photo-subheader {
  position: relative;
  overflow: visible;
  height: 200px;                  /* fotoğraf alanı sabit, hiçbir şey bunu değiştirmez */

  --deco-left: -74px;
  --deco-width: 74px;
  --deco-bar-h: 140px;             /* mavi yatay şeridin kalınlığı */
  --deco-gray-extra: 160px;       /* gri şeridin section'ın altına taşan miktarı */
}

.photo-subheader img {
  display: block;
  width: 100%;
  height: 100%;                   /* section'ın 200px'ini doldurur */
  object-fit: cover;
  object-position: center;
}

/* Gri dikey şerit: yalnızca kendi değişkenine bağlı */
.photo-subheader::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: calc(-1 * var(--deco-gray-extra));
  left: var(--deco-left);
  width: var(--deco-width);
  background: #8d9196;
  z-index: 2;
  pointer-events: none;
}

/* Mavi yatay şerit: section'ın hemen altından başlar */
.photo-subheader::after {
  content: "";
  position: absolute;
  /* section yüksekliği + gri taşma miktarı - mavi kalınlığı = grinin bittiği yerde biter */
  top: calc(100% + var(--deco-gray-extra) - var(--deco-bar-h));
  height: var(--deco-bar-h);
  right: calc(100% - (var(--deco-left) + var(--deco-width)));
  width: 100vw;
  background: #0475bb;
  opacity: .7;
  z-index: 3;
  pointer-events: none;
}
    .page-detailxxx { width:100%; padding-block:48px 60px; background:#fff; }
    .page-detailxxx__container { min-height:260px;    background: #ffffff;}
    .page-detailxxx__placeholder { max-width:820px; margin-inline:auto; padding:28px; border:1px dashed #cbd7dd; background:#f8fafb; }
    .page-detailxxx__placeholder h2 { margin:0 0 12px; color:#123d58; font-size:clamp(24px,2.5vw,34px); font-weight:500; }
    .page-detailxxx__placeholder p:last-child { margin:0; color:#536b78; font-size:14px; line-height:1.7; }
    @media(max-width:767.98px){ .page-detailxxx{padding-block:30px 38px}.page-detailxxx__placeholder{padding:20px} }