/* Duru Eğrilmez — typography, space, one restrained colour for contact.
   No image filters: the supplied portrait is resized, not retouched.
   Font binaries are not bundled. Google Fonts has system-font fallbacks. */
:root {
  --paper: #f6f4f0;
  --ink: #30382f;
  --blue: #d3e4f0;
  --muted: #596055;
  --rule: rgb(48 56 47 / 19%);
  --display: "EB Garamond 12", "EB Garamond", "Baskerville", "Palatino Linotype", Georgia, serif;
  --body: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  --gutter: clamp(24px, 6.05vw, 88px);
  --max-width: 1248px;
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 106px; -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  color: var(--ink);
  background: var(--paper);
  font: 400 16px/1.8 var(--body);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
::selection { color: var(--ink); background: var(--blue); }
a { color: inherit; text-decoration: none; text-underline-offset: .25em; }
a, button { -webkit-tap-highlight-color: transparent; }
button { font: inherit; }
a:focus-visible, button:focus-visible, [tabindex]:focus-visible { outline: 2px solid var(--ink); outline-offset: 5px; }
h1, h2, p, figure, ul { margin: 0; }
[hidden] { display: none !important; }
img { display: block; max-width: 100%; }
svg { width: 21px; height: 21px; flex-shrink: 0; }
svg path { stroke: currentColor; stroke-width: 1.25; stroke-linecap: round; stroke-linejoin: round; }
.shell { width: calc(100% - 2 * var(--gutter)); max-width: var(--max-width); margin-inline: auto; }
.skip-link { position: fixed; top: -100px; left: 24px; z-index: 50; padding: 12px 20px; background: var(--ink); color: var(--paper); }
.skip-link:focus { top: 12px; }
.site-header { background: var(--paper); }
.header-inner { min-height: 104px; display: flex; align-items: center; justify-content: space-between; gap: 36px; }
.wordmark { font: 400 21px/1.2 var(--display); letter-spacing: .01em; white-space: nowrap; padding-block: 12px; }
.site-nav { display: flex; align-items: center; gap: 37px; }
.site-nav a { position: relative; display: inline-flex; align-items: center; min-height: 44px; font-size: 13px; font-weight: 500; }
.site-nav a::after { content: ""; position: absolute; bottom: 6px; inset-inline: 0; height: 1px; background: currentColor; transform: scaleX(0); transform-origin: left; transition: transform .18s ease; }
.site-nav a:hover::after, .site-nav a[aria-current="location"]::after { transform: scaleX(1); }
.hero { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); align-items: center; column-gap: clamp(60px, 9vw, 132px); padding-top: 45px; padding-bottom: 88px; }
.hero-copy { padding-block: 0 30px; }
h1 { font: 400 clamp(88px, 9.4vw, 139px)/.86 var(--display); letter-spacing: -.046em; margin-left: -.025em; }
h1 span { display: block; }
h1 span + span { margin-top: .09em; }
.professional-title { font-size: 15px; line-height: 1.65; letter-spacing: .002em; margin-top: 29px; }
.title-break { display: none; }
.hero-description { max-width: 415px; font-size: 17px; line-height: 1.8; letter-spacing: -.016em; margin-top: 37px; }
.button { display: inline-flex; justify-content: space-between; align-items: center; gap: 33px; min-height: 56px; padding: 16px 22px; border: 1px solid transparent; border-radius: 1px; color: var(--ink); font-size: 12px; font-weight: 500; line-height: 1.4; transition: border-color .18s ease, background-color .18s ease; }
.button-blue { background: var(--blue); }
.button-blue:not(:disabled):hover { border-color: var(--ink); }
.button .arrow { width: 22px; }
.button:not(:disabled):hover .arrow { transform: translateX(3px); }
.button svg { transition: transform .18s ease; }
.hero-action { margin-top: 32px; min-width: 245px; }
.portrait { width: 100%; max-width: 440px; justify-self: end; }
.portrait-frame { width: 100%; aspect-ratio: 4 / 5; background: rgb(48 56 47 / 6%); overflow: hidden; }
.portrait img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 32%; }
.portrait figcaption { display: flex; gap: 12px; justify-content: flex-start; margin-top: 17px; color: var(--muted); font-size: 10px; letter-spacing: .05em; }
.portrait figcaption span { opacity: .55; }
.content-section { display: grid; grid-template-columns: minmax(0, .92fr) minmax(0, 1.6fr); gap: clamp(42px, 8vw, 116px); padding-block: 81px 88px; border-top: 1px solid var(--rule); }
h2 { font: 400 47px/1.06 var(--display); letter-spacing: -.035em; }
.section-body { max-width: 680px; min-width: 0; }
.section-body p { font-size: 16px; line-height: 1.95; letter-spacing: -.009em; }
.section-body p + p { margin-top: 22px; }
.text-link { display: inline-flex; align-items: center; gap: 23px; border-bottom: 1px solid var(--ink); padding-block: 9px; margin-top: 24px; min-height: 44px; font-size: 12px; font-weight: 500; }
.text-link:hover { opacity: .72; }
/* CV stays visible below the biography. It is plain text, not a dead link,
   until an approved URL is configured at build time. */
.cv-resource { margin-top: 28px; width: fit-content; max-width: 100%; }
.cv-placeholder { display: inline-flex; align-items: center; gap: 12px; min-height: 44px; padding-block: 9px; border-bottom: 1px solid var(--rule); font-size: 12px; font-weight: 500; line-height: 1.5; }
.cv-format { color: var(--muted); font-size: 10px; font-weight: 400; letter-spacing: .065em; white-space: nowrap; }
.cv-status { display: block; margin-top: 5px; color: var(--muted); font-size: 11px; line-height: 1.7; }
.cv-ready .text-link { margin-top: 0; gap: 14px; }

.services-section { padding-block: 67px 74px; }
.services-list { list-style: none; padding: 0; display: grid; grid-template-columns: 1fr 1fr; column-gap: 41px; }
.services-list li { font: 400 27px/1.25 var(--display); letter-spacing: -.016em; padding: 18px 0 21px; border-bottom: 1px solid var(--rule); }
.services-list li:nth-child(-n+2) { padding-top: 0; }
.services-list li:nth-last-child(-n+2) { border-bottom: 0; padding-bottom: 0; }
.contact-section { padding-block: 79px 95px; }
.contact-options { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 22px; margin-top: 31px; }
.contact-option { min-width: 0; }
.contact-option .button { width: 100%; gap: 12px; min-height: 54px; padding-inline: 17px; }
.contact-option .button svg { width: 19px; height: 19px; }
.button-outline { background: transparent; border-color: var(--rule); }
.button-outline:not(:disabled):hover { border-color: var(--ink); }
.button:disabled { color: var(--muted); cursor: not-allowed; }
.button:disabled svg { opacity: .65; }
.contact-value { display: block; margin-top: 11px; font-size: 12px; line-height: 1.6; overflow-wrap: anywhere; }
a.contact-value:hover { text-decoration: underline; }
.contact-pending { font-size: 11px; color: var(--muted); }
.section-body .preview-note { margin-top: 24px; font-size: 11px; line-height: 1.7; color: var(--muted); border-left: 1px solid var(--rule); padding-left: 12px; max-width: 52ch; }
.site-footer { border-top: 1px solid var(--rule); display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; column-gap: 32px; padding-block: 29px 33px; }
.footer-name { font: 400 25px/1.2 var(--display); letter-spacing: -.016em; }
.footer-identity p { font-size: 10px; margin-top: 6px; color: var(--muted); }
.copyright { font-size: 10px; color: var(--muted); }
.back-top { justify-self: end; display: inline-flex; align-items: center; gap: 14px; min-height: 44px; font-size: 11px; }
.back-top:hover { text-decoration: underline; }
.back-top svg { width: 17px; height: 17px; }
@media (min-width: 1600px) {
  .hero { padding-top: 65px; padding-bottom: 106px; }
  h1 { font-size: 145px; }
}
@media (max-width: 1100px) {
  :root { --gutter: 5vw; }
  .header-inner { min-height: 92px; }
  .hero { column-gap: 50px; padding-top: 40px; padding-bottom: 66px; }
  h1 { font-size: clamp(86px, 10vw, 110px); }
  .professional-title { font-size: 13px; margin-top: 26px; }
  .hero-description { font-size: 15px; margin-top: 27px; }
  .hero-action { min-width: 228px; margin-top: 27px; }
  .hero-copy { padding-bottom: 20px; }
  .portrait-frame { aspect-ratio: 3 / 4; }
  .content-section { grid-template-columns: minmax(0, .75fr) minmax(0, 1.55fr); gap: 48px; padding-block: 64px; }
  h2 { font-size: 41px; }
  .services-list { gap: 0 24px; }
  .services-list li { font-size: 25px; }
  .contact-options { gap: 14px; }
  .contact-option .button { font-size: 11px; padding-inline: 13px; }
}
@media (max-width: 800px) and (min-width: 701px) {
  .hero { gap: 26px; }
  h1 { font-size: 89px; }
  .hero-description { font-size: 14px; }
  .professional-title { font-size: 12px; }
  .title-break { display: block; }
  .portrait figcaption { font-size: 9px; gap: 8px; }
  .content-section { grid-template-columns: .8fr 1.5fr; gap: 32px; }
  h2 { font-size: 36px; }
  .contact-options { grid-template-columns: 1fr; }
}
@media (max-width: 700px) {
  :root { --gutter: 24px; }
  html { scroll-padding-top: 28px; }
  .header-inner { min-height: 0; display: block; padding-top: 21px; }
  .wordmark { display: none; }
  .site-nav { width: 100%; justify-content: space-between; gap: 14px; }
  .site-nav a { font-size: 12px; }
  .site-nav a::after { bottom: 8px; }
  .hero { display: flex; flex-direction: column; align-items: stretch; gap: 0; padding-top: 46px; padding-bottom: 44px; }
  .hero-copy { padding: 0; }
  h1 { font-size: clamp(83px, 22vw, 132px); line-height: .88; letter-spacing: -.045em; }
  h1 span + span { margin-top: .075em; }
  .professional-title { font-size: 12px; margin-top: 25px; line-height: 1.7; }
  .title-break { display: none; }
  .hero-description { font-size: 15px; line-height: 1.85; margin-top: 25px; max-width: 38ch; }
  .button { font-size: 11px; min-height: 52px; padding: 14px 18px; }
  .hero-action { margin-top: 25px; min-width: 229px; }
  .portrait { margin-top: 38px; max-width: none; align-self: center; width: 100%; }
  .portrait-frame { aspect-ratio: 4 / 5; max-height: 600px; }
  .portrait figcaption { font-size: 9px; gap: 11px; margin-top: 13px; }
  .content-section { display: block; padding-block: 44px 47px; }
  h2 { font-size: 39px; line-height: 1.15; }
  .section-heading { margin-bottom: 24px; }
  .section-body p { font-size: 15px; line-height: 1.9; }
  .section-body p + p { margin-top: 20px; }
  .desktop-break { display: none; }
  .services-list { display: block; }
  .services-list li, .services-list li:nth-child(-n+2), .services-list li:nth-last-child(-n+2) { padding: 18px 0; font-size: 27px; border-bottom: 1px solid var(--rule); }
  .services-list li:first-child { padding-top: 0; }
  .services-list li:last-child { border-bottom: 0; padding-bottom: 0; }
  .contact-options { margin-top: 28px; gap: 17px; grid-template-columns: minmax(0, 1fr); }
  .contact-option .button { min-height: 53px; font-size: 12px; padding-inline: 18px; }
  .contact-value { margin-top: 8px; }
  .contact-pending { font-size: 10px; }
  .section-body .preview-note { font-size: 10px; margin-top: 22px; }
  .site-footer { grid-template-columns: 1fr auto; gap: 18px; padding-block: 25px 30px; }
  .footer-name { font-size: 24px; }
  .footer-identity p { font-size: 9px; }
  .copyright { grid-column: 1; grid-row: 2; font-size: 9px; }
  .back-top { grid-column: 2; grid-row: 1 / 3; font-size: 10px; gap: 8px; }
}
@media (max-width: 359px) {
  :root { --gutter: 20px; }
  h1 { font-size: 79px; }
  .site-nav { gap: 8px; }
  .site-nav a { font-size: 10px; }
  .professional-title { font-size: 10.5px; }
  .hero-description { font-size: 13px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; animation: none !important; }
}
@media print {
  :root { --paper: #fff; --ink: #000; --muted: #333; }
  body { font-size: 11pt; }
  .shell { width: 100%; }
  .site-header, .button, .skip-link, .back-top, .preview-note, .contact-pending, .cv-pending { display: none !important; }
  .hero { display: grid; grid-template-columns: 1.4fr 1fr; gap: 45px; padding: 0 0 25px; }
  h1 { font-size: 68px; }
  .professional-title { font-size: 11pt; }
  .hero-description { margin-top: 18px; font-size: 11pt; }
  .portrait { max-width: 160px; margin-top: 0; }
  .portrait figcaption { font-size: 7pt; }
  .content-section { display: grid; grid-template-columns: .8fr 1.8fr; gap: 25px; padding-block: 22px; break-inside: avoid; }
  h2 { font-size: 25pt; }
  .section-body p { font-size: 10pt; line-height: 1.65; }
  .services-list li { font-size: 16pt; }
  .section-body p + p { margin-top: 12px; }
  .site-footer { padding-block: 20px 0; }
}
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
