/* Seçilen TASARIM 04 — Küçük birikimden büyük projeye. */
#servis-sureci.hpr-section,
#servis-sureci.hpr-section * { box-sizing: border-box; }
#servis-sureci.hpr-section { margin: 0; padding: 0; font-family: 'Hurda Inter', 'Open Sans', Arial, sans-serif; background: #fcfbf8; color: #092130; -webkit-font-smoothing: antialiased; scroll-margin-top: 20px; }
#servis-sureci.hpr-section a { text-decoration: none; }
#servis-sureci.hpr-section a:focus-visible,
#servis-sureci.hpr-section button:focus-visible { outline: 3px solid #f2c86d; outline-offset: 5px; }
#servis-sureci.hpr-section svg { display: block; flex-shrink: 0; }
#servis-sureci.hpr-section .hpr-main { display: grid; grid-template-columns: minmax(0,.396fr) minmax(0,.357fr) minmax(0,.247fr); grid-template-areas: 'photo copy services'; min-height: clamp(450px,30.65vw,589px); max-width: 1920px; margin: 0 auto; background: #001e2e; }
#servis-sureci.hpr-section .hpr-photo { grid-area: photo; position: relative; min-width: 0; margin: 0; overflow: hidden; }
#servis-sureci.hpr-section .hpr-photo img { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; }
#servis-sureci.hpr-section .hpr-photo::after { content: ''; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(90deg,transparent 78%,rgba(0,30,46,.12) 86%,#001e2e 100%); }
#servis-sureci.hpr-section .hpr-copy { grid-area: copy; min-width: 0; padding: clamp(54px,4.6vw,88px) clamp(18px,1.25vw,24px) clamp(35px,2.65vw,51px) clamp(28px,1.7vw,33px); }
#servis-sureci.hpr-section .hpr-title { padding: 0; margin: 0 0 clamp(24px,1.7vw,33px); color: #edc16a; font-size: clamp(38px,3.52vw,67px); font-weight: 850; line-height: 1.07; letter-spacing: -.037em; }
#servis-sureci.hpr-section .hpr-title span { display: block; }
#servis-sureci.hpr-section .hpr-copy p { padding: 0; margin: 0 0 clamp(18px,1.15vw,22px); color: #eef3f5; font-size: clamp(17px,1.29vw,24px); font-weight: 400; line-height: 1.5; letter-spacing: -.015em; }
#servis-sureci.hpr-section .hpr-copy p:last-of-type { margin-bottom: 0; }
#servis-sureci.hpr-section .hpr-about-link { display: inline-flex; align-items: center; justify-content: center; gap: clamp(14px,1.1vw,21px); min-height: clamp(56px,3.65vw,70px); margin-top: clamp(27px,1.9vw,36px); padding: 14px clamp(28px,2.25vw,43px); border: 1.5px solid #f0f3f5; border-radius: 999px; color: #fff; background: transparent; font-size: clamp(16px,1.1vw,21px); font-weight: 750; line-height: 1.3; transition: background-color .18s,color .18s; }
#servis-sureci.hpr-section .hpr-about-link svg { width: 25px; height: 25px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
#servis-sureci.hpr-section .hpr-about-link:hover { color: #001e2e; background: #edc16a; border-color: #edc16a; }
#servis-sureci.hpr-section .hpr-services { grid-area: services; min-width: 0; padding: clamp(40px,3.7vw,71px) 2.2vw clamp(30px,2vw,38px) 1.5vw; }
#servis-sureci.hpr-section .hpr-service { display: grid; grid-template-columns: clamp(45px,3.65vw,70px) minmax(0,1fr); gap: clamp(17px,1.65vw,31px); align-items: center; min-height: clamp(125px,8vw,154px); padding: 24px 0; color: #fff; }
#servis-sureci.hpr-section .hpr-service + .hpr-service { border-top: 1px solid #e7bc5b; }
#servis-sureci.hpr-section .hpr-service-icon svg { width: 100%; height: auto; fill: none; stroke: #edc16a; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
#servis-sureci.hpr-section .hpr-service h3 { padding: 0; margin: 0 0 8px; color: #fff; font-size: clamp(18px,1.29vw,24px); font-weight: 800; line-height: 1.3; letter-spacing: -.025em; }
#servis-sureci.hpr-section .hpr-service p { padding: 0; margin: 0; color: #edf1f3; font-size: clamp(15px,1.04vw,20px); line-height: 1.5; letter-spacing: -.02em; }
#servis-sureci.hpr-section .hpr-service:hover h3 { color: #edc16a; }
#servis-sureci.hpr-section .hpr-processes { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 1.8vw; max-width: 1920px; padding: clamp(30px,2.1vw,40px) 3.45vw clamp(44px,3.7vw,71px); margin: 0 auto; list-style: none; }
#servis-sureci.hpr-section .hpr-step { position: relative; display: grid; grid-template-columns: clamp(108px,8.6vw,165px) minmax(0,1fr); align-items: start; gap: clamp(17px,1.1vw,21px); min-width: 0; margin: 0; padding: 0; }
#servis-sureci.hpr-section .hpr-step-photo { display: block; width: 100%; height: auto; aspect-ratio: 1; border-radius: 50%; object-fit: cover; }
#servis-sureci.hpr-section .hpr-step-content { min-width: 0; }
#servis-sureci.hpr-section .hpr-step-number { display: flex; align-items: center; justify-content: center; width: clamp(30px,2.05vw,39px); height: clamp(30px,2.05vw,39px); margin: 0 0 10px; border-radius: 50%; background: linear-gradient(120deg,#f3ce77,#e9bb5c); color: #092130; font-size: clamp(16px,1.15vw,22px); font-weight: 800; line-height: 1; }
#servis-sureci.hpr-section .hpr-step h3 { margin: 0 0 7px; padding: 0; color: #092130; font-size: clamp(18px,1.31vw,25px); font-weight: 800; line-height: 1.25; letter-spacing: -.035em; }
#servis-sureci.hpr-section .hpr-step p { padding: 0; margin: 0; color: #5d6976; font-size: clamp(14px,.99vw,18.5px); line-height: 1.5; letter-spacing: -.018em; }
#servis-sureci.hpr-section .hpr-step-arrow { position: absolute; top: 42%; right: -1.45vw; width: 25px; height: 25px; fill: none; stroke: #092130; stroke-width: 1.3; stroke-linecap: round; stroke-linejoin: round; }
#servis-sureci.hpr-section .hpr-dialog { position: fixed; inset: 0; width: min(92vw,650px); max-height: 85dvh; margin: auto; padding: 35px; border: 1px solid #ddc695; border-radius: 22px; background: #fcfbf8; color: #092130; box-shadow: 0 25px 100px rgba(0,18,29,.3); overflow: auto; overscroll-behavior: contain; }
#servis-sureci.hpr-section .hpr-dialog::backdrop { background: rgba(0,18,29,.7); }
#servis-sureci.hpr-section .hpr-dialog-head { display: flex; align-items: start; justify-content: space-between; gap: 20px; margin-bottom: 22px; }
#servis-sureci.hpr-section .hpr-dialog h2 { margin: 0; padding: 0; color: #092130; font-size: 29px; font-weight: 850; line-height: 1.2; letter-spacing: -.035em; }
#servis-sureci.hpr-section .hpr-dialog-close { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: 38px; height: 38px; padding: 0; border: 1px solid #ddd3bf; border-radius: 9px; color: #092130; background: #fff; cursor: pointer; }
#servis-sureci.hpr-section .hpr-dialog-close svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; }
#servis-sureci.hpr-section .hpr-dialog p { margin: 0 0 17px; padding: 0; color: #53616c; font-size: 16px; line-height: 1.65; }
#servis-sureci.hpr-section .hpr-dialog-cta { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 50px; margin-top: 6px; padding: 12px 21px; border-radius: 10px; background: #159e49; color: #fff; font-size: 16px; font-weight: 750; }
#servis-sureci.hpr-section .hpr-dialog-cta:hover { background: #10853c; color: #fff; }
#servis-sureci.hpr-section .hpr-dialog-cta svg { width: 25px; height: 25px; fill: currentColor; }
@media (max-width:1320px) {
  #servis-sureci.hpr-section .hpr-processes { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 32px 48px; padding: 38px 4vw 45px; }
  #servis-sureci.hpr-section .hpr-step { grid-template-columns: 130px minmax(0,1fr); gap: 23px; }
  #servis-sureci.hpr-section .hpr-step h3 { font-size: 22px; }
  #servis-sureci.hpr-section .hpr-step p { font-size: 16px; }
  #servis-sureci.hpr-section .hpr-step-arrow { display: none; }
}
@media (max-width:1180px) {
  #servis-sureci.hpr-section .hpr-main { grid-template-columns: minmax(0,.43fr) minmax(0,.57fr); grid-template-areas: 'photo copy' 'services services'; }
  #servis-sureci.hpr-section .hpr-copy { padding: 48px 5vw 43px 31px; }
  #servis-sureci.hpr-section .hpr-title { font-size: clamp(37px,4.6vw,54px); }
  #servis-sureci.hpr-section .hpr-copy p { font-size: 18px; }
  #servis-sureci.hpr-section .hpr-services { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 23px; padding: 22px 4vw 28px; border-top: 1px solid rgba(237,193,106,.3); }
  #servis-sureci.hpr-section .hpr-service { grid-template-columns: 46px minmax(0,1fr); gap: 16px; min-height: 100px; padding: 10px 0; }
  #servis-sureci.hpr-section .hpr-service + .hpr-service { border-top: 0; }
  #servis-sureci.hpr-section .hpr-service h3 { font-size: 19px; }
  #servis-sureci.hpr-section .hpr-service p { font-size: 15px; }
}
@media (max-width:760px) {
  #servis-sureci.hpr-section .hpr-main { grid-template-columns: minmax(0,1fr); grid-template-areas: 'copy' 'photo' 'services'; }
  #servis-sureci.hpr-section .hpr-copy { padding: 35px 24px 32px; }
  #servis-sureci.hpr-section .hpr-title { font-size: clamp(35px,7vw,49px); margin-bottom: 25px; }
  #servis-sureci.hpr-section .hpr-copy p { font-size: 17px; line-height: 1.6; }
  #servis-sureci.hpr-section .hpr-about-link { min-height: 54px; margin-top: 26px; font-size: 16px; }
  #servis-sureci.hpr-section .hpr-photo { min-height: clamp(250px,63vw,460px); }
  #servis-sureci.hpr-section .hpr-photo img { object-position: center 55%; }
  #servis-sureci.hpr-section .hpr-photo::after { background: linear-gradient(0deg,#001e2e,transparent 22%); }
  #servis-sureci.hpr-section .hpr-services { grid-template-columns: minmax(0,1fr); gap: 0; padding: 5px 26px 25px; border-top: 0; }
  #servis-sureci.hpr-section .hpr-service { grid-template-columns: 48px minmax(0,1fr); gap: 22px; min-height: 107px; padding: 22px 0; }
  #servis-sureci.hpr-section .hpr-service + .hpr-service { border-top: 1px solid rgba(237,193,106,.65); }
  #servis-sureci.hpr-section .hpr-service h3 { font-size: 21px; }
  #servis-sureci.hpr-section .hpr-service p { font-size: 16px; }
  #servis-sureci.hpr-section .hpr-processes { gap: 29px 24px; padding: 33px 24px 40px; }
  #servis-sureci.hpr-section .hpr-step { grid-template-columns: 90px minmax(0,1fr); gap: 16px; }
  #servis-sureci.hpr-section .hpr-step h3 { font-size: 20px; }
  #servis-sureci.hpr-section .hpr-step p { font-size: 14px; }
}
@media (max-width:600px) {
  #servis-sureci.hpr-section .hpr-processes { grid-template-columns: minmax(0,1fr); gap: 27px; }
  #servis-sureci.hpr-section .hpr-step { grid-template-columns: 104px minmax(0,1fr); gap: 22px; }
  #servis-sureci.hpr-section .hpr-step-content { display: grid; grid-template-columns: 30px minmax(0,1fr); gap: 0 10px; }
  #servis-sureci.hpr-section .hpr-step-number { width: 30px; height: 30px; margin: 0; font-size: 16px; }
  #servis-sureci.hpr-section .hpr-step h3 { align-self: center; margin: 0; font-size: 21px; }
  #servis-sureci.hpr-section .hpr-step p { grid-column: 1 / -1; margin-top: 10px; font-size: 15px; }
  #servis-sureci.hpr-section .hpr-dialog { padding: 25px 22px; border-radius: 18px; }
  #servis-sureci.hpr-section .hpr-dialog h2 { font-size: 25px; }
}
@media (max-width:360px) {
  #servis-sureci.hpr-section .hpr-copy { padding-right: 20px; padding-left: 20px; }
  #servis-sureci.hpr-section .hpr-title { font-size: 32px; }
  #servis-sureci.hpr-section .hpr-processes { padding-right: 20px; padding-left: 20px; }
  #servis-sureci.hpr-section .hpr-step { grid-template-columns: 84px minmax(0,1fr); gap: 16px; }
  #servis-sureci.hpr-section .hpr-step h3 { font-size: 19px; }
  #servis-sureci.hpr-section .hpr-step p { font-size: 14px; }
}
@media (prefers-reduced-motion:reduce) { #servis-sureci.hpr-section * { transition: none !important; scroll-behavior: auto !important; } }