.project-reference { background: #faf9f6; }

.pd-page { 
  --pd-navy: #001b32; 
  --pd-red: #dc202d; 
  --pd-paper: #fbfaf7; 
  --pd-alt: #ffffff; 
  --pd-line: #dad7cf; 
  --pd-copy: #526677; 
  overflow: clip; 
  color: var(--pd-navy); 
  background: var(--pd-paper); 
  font-family: 'Inter', system-ui, -apple-system, sans-serif; 
}
.pd-page *,.pd-page *::before,.pd-page *::after { box-sizing:border-box; }
.pd-page img { display:block; width:100%; height:100%; object-fit:cover; }
.pd-shell { width:min(92%,1440px); margin-inline:auto; }

/* Hero */
.pd-hero { 
  position: relative; 
  min-height: clamp(560px, calc(100vh - 76px), 880px); 
  height: calc(100vh - 76px); 
  display: flex; 
  align-items: center; 
  isolation: isolate; 
  overflow: hidden; 
  color: #fff; 
  background: #03243a; 
}
.pd-hero > img,.pd-hero-overlay { position:absolute; inset:0; }
.pd-hero > img { z-index:-2; object-position:center 52%; }
.pd-hero-overlay { 
  z-index:-1; 
  background: linear-gradient(90deg, rgba(1, 29, 47, 0.95) 0%, rgba(1, 31, 51, 0.85) 36%, rgba(1, 32, 51, 0.4) 66%, rgba(1, 31, 50, 0.1) 100%),
              linear-gradient(180deg, rgba(0, 20, 34, 0.25) 0%, transparent 40%, rgba(0, 25, 40, 0.2) 100%);
}
.pd-hero-copy {
  position: relative;
  z-index: 2;
  width: min(92%, 1440px);
  max-width: 720px;
  margin-left: max(32px, calc((100% - 1440px) / 2));
}
.pd-hero-copy h1 { 
  margin: 0; 
  color: #fff; 
  font-size: clamp(40px, 4.4vw, 70px); 
  font-weight: 900; 
  letter-spacing: -0.02em; 
  line-height: 1.06;
}
.pd-hero-copy i { display:block; width:48px; height:3px; margin:20px 0; background:var(--pd-red); }
.pd-hero-copy p { 
  margin: 0;
  color: rgba(255, 255, 255, 0.92); 
  font-size: clamp(15px, 1.2vw, 18px); 
  line-height: 1.55; 
  max-width: 580px;
}

/* Intro */
.pd-intro { padding: 64px 0 54px; border-bottom: 1px solid var(--pd-line); background: #faf8f5; }
.pd-intro-grid { display: grid; grid-template-columns: 1fr 1.2fr; gap: 60px; align-items: center; }
.pd-intro-copy h2 { 
  margin: 0 0 20px; 
  color: var(--pd-navy);
  font-size: clamp(28px, 2.5vw, 42px); 
  font-weight: 900; 
  letter-spacing: -0.02em; 
  line-height: 1.15; 
}
.pd-intro-copy p { 
  margin: 0 0 14px; 
  color: var(--pd-copy); 
  font-size: 15px; 
  line-height: 1.65; 
}
.pd-intro-image { height: 380px; }
.pd-intro-image img { object-fit: contain; mix-blend-mode: multiply; }

/* Process */
.pd-process { padding: 54px 0 54px; border-bottom: 1px solid var(--pd-line); background: #fbfaf7; }
.pd-process h2, .pd-disciplines > .pd-shell > h2, .pd-delivery > .pd-shell > h2 { 
  margin-bottom: 36px; 
  font-size: clamp(24px, 2.2vw, 32px); 
  font-weight: 900; 
  color: var(--pd-navy);
}
.pd-process-flow { display: grid; grid-template-columns: 1fr 80px 1fr 80px 1fr 80px 1fr; align-items: start; }
.pd-process-flow article { text-align: center; }
.pd-process-flow article > span { 
  width: 64px; 
  height: 64px; 
  display: grid; 
  place-items: center; 
  margin: 0 auto 16px; 
  border: 2px solid var(--pd-red); 
  border-radius: 50%; 
  color: var(--pd-red); 
  background: #fff; 
}
.pd-process-flow svg { width: 32px; height: 32px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.pd-process-flow h3 { margin-bottom: 8px; font-size: 15px; font-weight: 800; color: var(--pd-navy); }
.pd-process-flow p { max-width: 220px; margin: auto; color: var(--pd-copy); font-size: 13.5px; line-height: 1.5; }
.pd-process-flow > i { position: relative; height: 2px; margin-top: 32px; background: var(--pd-red); }
.pd-process-flow > i::after { content: ''; position: absolute; top: -4px; left: 50%; width: 10px; height: 10px; border-radius: 50%; background: var(--pd-red); transform: translateX(-50%); }

/* Disciplines */
.pd-disciplines { padding: 54px 0 54px; background: #fff; border-bottom: 1px solid var(--pd-line); }
.pd-discipline-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }
.pd-discipline-grid article { 
  min-height: 280px; 
  display: flex; 
  flex-direction: column; 
  padding: 28px 24px 24px; 
  border: 1px solid var(--pd-line); 
  border-radius: 8px;
  background: #fbfaf7; 
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; 
}
.pd-discipline-grid article:hover { transform: translateY(-4px); box-shadow: 0 10px 24px rgba(0,27,50,.06); border-color: #c5c2ba; }
.pd-discipline-grid svg { width: 100%; height: 90px; margin-bottom: 18px; fill: none; stroke: var(--pd-navy); stroke-linecap: round; stroke-linejoin: round; }
.pd-discipline-grid h3 { margin: 0 0 10px; font-size: 16px; font-weight: 800; color: var(--pd-navy); line-height: 1.25; }
.pd-discipline-grid p { margin: 0; color: var(--pd-copy); font-size: 13.5px; line-height: 1.55; }
.pd-discipline-grid article > i { display: block; width: 36px; height: 2px; margin-top: auto; padding-top: 18px; border-bottom: 2px solid var(--pd-red); }

/* Engineering Rows */
.pd-engineering-row { padding: 54px 0; border-bottom: 1px solid var(--pd-line); background: #faf8f5; }
.pd-engineering-row--alt { background: #ffffff; }
.pd-engineering-grid { display: grid; grid-template-columns: 0.85fr 1.15fr 1.6fr; gap: 44px; align-items: center; }
.pd-engineering-row header > i { display: block; width: 54px; height: 2px; margin-bottom: 18px; background: linear-gradient(90deg, var(--pd-red) 0 10px, transparent 10px 24px, var(--pd-red) 24px 54px); }
.pd-engineering-row header h2 { margin: 0 0 14px; font-size: clamp(22px, 2vw, 28px); font-weight: 900; color: var(--pd-navy); line-height: 1.2; }
.pd-engineering-row header p { max-width: 320px; color: var(--pd-copy); font-size: 14px; line-height: 1.6; }
.pd-engineering-row figure { height: 290px; overflow: hidden; border-radius: 8px; }
.pd-engineering-row figure img { object-fit: contain; mix-blend-mode: multiply; }
.pd-bullets { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }
.pd-bullets ul { list-style: none; padding: 0; margin: 0; }
.pd-bullets li { position: relative; margin-bottom: 16px; padding-left: 18px; }
.pd-bullets li::before { content: '›'; position: absolute; left: 0; top: -2px; color: var(--pd-red); font-size: 20px; font-weight: 900; }
.pd-bullets b { display: block; margin-bottom: 4px; font-size: 14px; font-weight: 800; color: var(--pd-navy); line-height: 1.35; }
.pd-bullets span { display: block; color: var(--pd-copy); font-size: 13px; line-height: 1.45; }

/* Delivery */
.pd-delivery { padding: 48px 0 40px; background: #fff; }
.pd-delivery-grid { display: grid; grid-template-columns: repeat(5, 1fr); margin-bottom: 40px; }
.pd-delivery-grid article { min-height: 96px; display: grid; grid-template-columns: 52px 1fr; gap: 16px; align-items: center; padding: 12px 20px; border-right: 1px solid var(--pd-line); }
.pd-delivery-grid article:last-child { border-right: 0; }
.pd-delivery-grid svg { width: 44px; height: 44px; fill: none; stroke: var(--pd-navy); stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.pd-delivery-grid h3 { margin: 0; font-size: 13.5px; font-weight: 800; color: var(--pd-navy); line-height: 1.3; }

/* CTA */
.pd-cta {
  min-height: 260px;
  display: grid;
  grid-template-columns: 50% 50%;
  align-items: center;
  overflow: visible;
  border: none;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  margin-top: 32px;
  padding: 16px 0;
}

.pd-cta-copy {
  padding: 24px 32px 24px 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.pd-cta-copy h2 {
  margin: 0 0 14px;
  font-size: clamp(22px, 2vw, 30px);
  font-weight: 900;
  color: var(--pd-navy);
  line-height: 1.2;
  letter-spacing: -0.01em;
  text-transform: uppercase;
}

.pd-cta-copy p {
  margin: 0 0 24px;
  color: var(--pd-copy);
  font-size: 14px;
  line-height: 1.55;
  max-width: 500px;
}

.pd-cta-copy .vln-cta-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  height: 48px;
  padding: 0 28px;
  color: #fff !important;
  background: var(--pd-red) !important;
  font-family: 'Inter', system-ui, -apple-system, sans-serif !important;
  font-size: 13px;
  font-weight: 800 !important;
  letter-spacing: 0.04em;
  text-transform: uppercase !important;
  border-radius: 4px;
  text-decoration: none;
  box-shadow: 0 4px 14px rgba(220, 32, 45, 0.28);
  transition: all .25s ease;
}

.pd-cta-copy .vln-cta-btn:hover {
  background: #b81622 !important;
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(220, 32, 45, 0.4);
}

.pd-cta-copy .vln-cta-btn span {
  font-size: 16px;
  transition: transform .25s ease;
}

.pd-cta-copy .vln-cta-btn:hover span {
  transform: translateX(4px);
}

.pd-cta-visual {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding: 0;
}

.pd-cta-visual img {
  width: 100%;
  height: 100%;
  max-height: 380px;
  object-fit: contain;
  mix-blend-mode: multiply;
  display: block;
}

/* Slow Scroll Reveal System for Projelendirme */
.pd-hero-copy,
.pd-intro-grid > div,
.pd-process-flow article,
.pd-discipline-grid article,
.pd-engineering-grid > *,
.pd-delivery-grid article,
.pd-cta,
.vln-scroll-target,
[data-reveal] {
  opacity: 0;
  transform: translateY(45px) scale(0.98);
  filter: blur(3px);
  transition: opacity 1.15s cubic-bezier(0.16, 1, 0.3, 1),
              transform 1.30s cubic-bezier(0.16, 1, 0.3, 1),
              filter 1.15s cubic-bezier(0.16, 1, 0.3, 1);
  will-change: opacity, transform, filter;
}

.pd-hero-copy.is-revealed,
.pd-intro-grid > div.is-revealed,
.pd-process-flow article.is-revealed,
.pd-discipline-grid article.is-revealed,
.pd-engineering-grid > *.is-revealed,
.pd-delivery-grid article.is-revealed,
.pd-cta.is-revealed,
.vln-scroll-target.is-visible,
.vln-scroll-target.is-revealed,
[data-reveal].is-visible,
[data-reveal].is-revealed {
  opacity: 1 !important;
  transform: none !important;
  filter: blur(0) !important;
}

@media(max-width:1100px){
  .pd-intro-grid { grid-template-columns:1fr; gap:25px; }
  .pd-intro-image { height:360px; }
  .pd-process-flow { grid-template-columns:repeat(4,1fr); gap:18px; }
  .pd-process-flow > i { display:none; }
  .pd-discipline-grid { grid-template-columns:1fr 1fr; }
  .pd-engineering-grid { grid-template-columns:.7fr 1.3fr; }
  .pd-bullets { grid-column:1/-1; padding-top:15px; border-top:1px solid var(--pd-line); }
  .pd-delivery-grid { grid-template-columns:1fr 1fr; }
  .pd-delivery-grid article { border-bottom:1px solid var(--pd-line); }
}

@media(max-width:760px){
  .pd-shell { width:calc(100% - 32px); }
  .pd-hero { min-height:430px; padding-top:70px; }
  .pd-hero > img { object-position:60% center; }
  .pd-intro { padding-top:45px; }
  .pd-intro-image { height:260px; }
  .pd-process-flow { grid-template-columns:1fr 1fr; gap:30px 15px; }
  .pd-discipline-grid { grid-template-columns:1fr; }
  .pd-engineering-grid { grid-template-columns:1fr; gap:22px; }
  .pd-engineering-row figure { height:260px; }
  .pd-bullets { grid-column:auto; grid-template-columns:1fr; gap:0; }
  .pd-delivery-grid { grid-template-columns:1fr; }
  .pd-delivery-grid article { border-right:0; }
  .pd-cta { grid-template-columns:1fr; }
  .pd-cta > img { height:170px; }
  .pd-cta > div { padding:25px; }
  .pd-cta a { width:100%; }
}

@media(prefers-reduced-motion:reduce){[data-reveal]{opacity:1;transform:none;transition:none}}
