/* ARKNOVA MİMARLIK — Genel tasarım ve mobil ekran stilleri */


:root {
  --ink:#1b1e1b;
  --muted:#6b716b;
  --soft:#f2f3ef;
  --line:#dce0d9;
  --accent:#9b6248;
  --gutter:6vw
}

* {
  box-sizing:border-box
}

html {
  scroll-behavior:smooth;
  scroll-padding-top:110px
}

body {
  margin:0;
  background:#fff;
  color:var(--ink);
  font:16px/1.75 Manrope,Arial,sans-serif
}

a {
  color:inherit;
  text-decoration:none
}

button,input,select,textarea {
  font:inherit
}

button {
  color:inherit;
  cursor:pointer;
  border-radius:0
}

a,button,input,summary {
  -webkit-tap-highlight-color:transparent
}

a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible {
  outline:3px solid var(--accent);
  outline-offset:5px
}

img {
  display:block;
  max-width:100%
}

h1,h2,h3,p,figure {
  margin:0
}

h1,h2,h3 {
  font-weight:500;
  letter-spacing:-.045em;
  line-height:1.12
}

h1 {
  font-size:clamp(2.8rem,5.6vw,6.3rem)
}

h2 {
  font-size:clamp(2.1rem,3.7vw,4.2rem)
}

h3 {
  font-size:1.5rem;
  letter-spacing:-.025em
}

p {
  overflow-wrap:break-word
}

button:disabled {
  cursor:default;
  opacity:.4
}

[hidden] {
  display:none!important
}

.wrap {
  padding-left:var(--gutter);
  padding-right:var(--gutter);
  max-width:1800px;
  margin:auto
}

.kicker {
  font-size:.75rem;
  font-weight:600;
  letter-spacing:.15em;
  line-height:1.5;
  text-transform:uppercase;
  display:block
}

.line-link {
  display:inline-block;
  font-size:.875rem;
  border-bottom:1px solid;
  padding-bottom:6px;
  line-height:1.7
}

.line-link:hover {
  color:var(--accent)
}

.button {
  border:1px solid var(--ink);
  background:var(--ink);
  color:white;
  padding:15px 27px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:54px;
  font-size:.875rem;
  transition:background .2s,color .2s
}

.button:hover {
  background:#4a5247;
  border-color:#4a5247
}

.button.white {
  color:white;
  background:transparent;
  border-color:#fff9
}

.button.white:hover {
  background:white;
  color:var(--ink)
}

.skip {
  position:fixed;
  left:15px;
  top:-100px;
  z-index:100;
  background:white;
  padding:10px
}

.skip:focus {
  top:10px
}

.sr-only {
  position:absolute;
  width:1px;
  height:1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap
}

.header {
  height:94px;
  position:sticky;
  top:0;
  z-index:40;
  background:#fffffffa;
  backdrop-filter:blur(12px);
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 4vw;
  border-bottom:1px solid #00000009
}

.brand {
  display:inline-block;
  flex-shrink:0
}

.brand img {
  width:205px;
  height:auto
}

.desktop-nav {
  display:flex;
  gap:32px;
  align-items:center;
  font-size:.875rem
}

.desktop-nav a {
  padding:7px 0;
  border-bottom:1px solid transparent
}

.desktop-nav a:hover,.desktop-nav a[aria-current] {
  border-color:var(--ink)
}

.menu-toggle {
  display:none;
  background:none;
  border:0;
  min-height:44px;
  gap:15px;
  align-items:center
}

.menu-toggle span {
  font-size:.75rem;
  letter-spacing:.12em
}

.menu-toggle i {
  display:block;
  position:relative;
  width:25px;
  height:10px;
  border-top:1px solid;
  border-bottom:1px solid
}

.menu-toggle[aria-expanded=true] i {
  transform:rotate(-45deg);
  height:0;
  border-bottom:0
}

.menu-toggle[aria-expanded=true] i:after {
  content:'';
  position:absolute;
  top:-1px;
  left:0;
  width:25px;
  height:1px;
  background:currentColor;
  transform:rotate(90deg)
}

.mobile-menu {
  position:fixed;
  top:80px;
  bottom:0;
  left:0;
  right:0;
  background:#fff;
  z-index:39;
  overflow:auto;
  padding:20px 7% 40px
}

.mobile-menu>a {
  display:flex;
  align-items:baseline;
  gap:22px;
  font-size:2rem;
  padding:13px 0;
  border-bottom:1px solid var(--line);
  line-height:1.5
}

.mobile-menu small {
  font-size:.75rem;
  color:var(--muted)
}

.mobile-contact {
  display:flex;
  flex-wrap:wrap;
  gap:10px 25px;
  padding-top:35px;
  font-size:.875rem
}

.menu-open {
  overflow:hidden
}

.home-hero {
  position:relative;
  height:calc(100svh - 94px);
  min-height:650px;
  max-height:1050px;
  background:#40443b;
  color:white;
  overflow:hidden
}

.hero-images,.hero-slide,.hero-overlay {
  position:absolute;
  inset:0;
  width:100%;
  height:100%
}

.hero-slide {
  object-fit:cover;
  opacity:0;
  transition:opacity .7s
}

.hero-slide.is-active {
  opacity:1
}

.hero-overlay {
  background:linear-gradient(90deg,#09130ecc,transparent 95%),linear-gradient(0deg,#06120c70,transparent 45%)
}

.hero-copy {
  position:relative;
  z-index:1;
  padding:clamp(80px,14vh,170px) var(--gutter) 130px
}

.hero-copy h1 {
  font-size:clamp(4rem,7.5vw,8.5rem);
  letter-spacing:-.065em;
  line-height:1.03;
  margin:28px 0 40px
}

.hero-copy .kicker {
  color:#e8ece5
}

.hero-meta {
  position:absolute;
  z-index:2;
  bottom:30px;
  left:var(--gutter);
  right:var(--gutter);
  display:flex;
  justify-content:space-between;
  align-items:end;
  border-top:1px solid #ffffff50;
  padding-top:22px
}

.hero-meta .kicker {
  font-size:.75rem;
  margin-bottom:7px
}

.hero-meta>div>a {
  font-size:.9375rem
}

.hero-tabs {
  display:flex;
  gap:8px
}

.hero-tabs button {
  background:transparent;
  border:0;
  border-bottom:1px solid #fff5;
  color:#fff8;
  padding:8px 20px
}

.hero-tabs button[aria-pressed=true] {
  color:#fff;
  border-color:#fff
}

.hero-location {
  font-size:.75rem;
  letter-spacing:.12em
}

.intro {
  display:grid;
  grid-template-columns:1fr 2.2fr;
  gap:5%;
  padding-top:115px;
  padding-bottom:115px
}

.intro>.kicker {
  padding-top:10px
}

.intro h2 span {
  color:var(--muted)
}

.two-copy {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:35px;
  margin-top:35px;
  color:var(--muted)
}

.intro .line-link {
  margin-top:32px
}

.section-heading {
  display:flex;
  justify-content:space-between;
  align-items:end;
  gap:25px;
  margin-bottom:40px
}

.section-heading .kicker {
  margin-bottom:20px
}

.section-heading .line-link {
  white-space:nowrap
}

.selected {
  padding-bottom:110px
}

.project-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:50px 30px
}

.project-card {
  min-width:0
}

.card-image {
  position:relative;
  overflow:hidden;
  background:#e3e5df
}

.card-image>img {
  width:100%;
  aspect-ratio:1.36;
  object-fit:cover;
  transition:transform .6s
}

.project-card a:hover .card-image>img {
  transform:scale(1.04)
}

.card-open {
  position:absolute;
  bottom:16px;
  right:16px;
  background:#fff;
  color:var(--ink);
  padding:9px 13px;
  font-size:.75rem;
  letter-spacing:.06em;
  display:flex;
  align-items:center;
  gap:20px;
  opacity:0;
  transform:translateY(8px);
  transition:opacity .2s,transform .2s
}

.card-open b {
  font-size:1.3rem;
  font-weight:400;
  line-height:1
}

.project-card a:hover .card-open,.project-card a:focus-visible .card-open {
  opacity:1;
  transform:none
}

.card-index {
  position:absolute;
  top:16px;
  left:16px;
  background:#fff;
  padding:3px 10px;
  font-size:.75rem
}

.card-title {
  padding:19px 0 16px;
  border-bottom:1px solid var(--line)
}

.card-title h3 {
  font-size:1.45rem;
  line-height:1.25;
  margin-bottom:6px
}

.card-title>span {
  font-size:.75rem;
  color:var(--muted)
}

.editorial-grid {
  grid-template-columns:1.1fr 1fr;
  column-gap:6%
}

.editorial-grid .project-card:nth-child(2n) {
  padding-top:95px
}

.editorial-grid .project-card:nth-child(2n) .card-image>img {
  aspect-ratio:.98
}

.home-services {
  background:var(--soft);
  max-width:none;
  display:grid;
  grid-template-columns:1fr 1.45fr;
  gap:9%;
  padding-top:100px;
  padding-bottom:100px
}

.home-services h2 {
  margin-top:27px
}

.service-links a {
  display:grid;
  grid-template-columns:35px 1fr;
  border-top:1px solid #bbc2b7;
  padding:28px 0;
  gap:12px
}

.service-links a:last-child {
  border-bottom:1px solid #bbc2b7
}

.service-links small {
  font-size:.75rem;
  color:var(--muted)
}

.service-links h3 {
  font-size:1.7rem
}

.service-links span {
  grid-column:2;
  font-size:.875rem;
  color:var(--muted)
}

.service-links a:hover h3 {
  color:var(--accent)
}

.process-teaser {
  display:grid;
  grid-template-columns:1fr 1fr;
  background:var(--ink);
  color:white
}

.process-teaser>div:first-child>img {
  width:100%;
  height:100%;
  max-height:740px;
  object-fit:cover
}

.process-teaser-copy {
  padding:90px 12%;
  align-self:center
}

.process-teaser-copy h2 {
  margin:25px 0
}

.process-teaser-copy>p:not(.kicker) {
  color:#c0c7bb;
  max-width:450px
}

.process-teaser-copy .line-link {
  margin-top:32px
}

.cta {
  padding-top:100px;
  padding-bottom:100px
}

.cta>.kicker {
  margin-bottom:23px;
  color:var(--muted)
}

.cta>div {
  display:flex;
  justify-content:space-between;
  align-items:end;
  gap:25px
}

.cta .button {
  flex-shrink:0
}

.footer {
  background:#1b1e1b;
  color:#eef0eb;
  padding:55px var(--gutter) 24px
}

.footer .brand img {
  filter:invert(1)
}

.footer-top {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:25px;
  padding-bottom:45px;
  border-bottom:1px solid #ffffff2b
}

.footer-top p {
  font-size:.875rem;
  color:#b7beb2
}

.footer-top>a:last-child {
  font-size:.875rem
}

.footer-grid {
  display:grid;
  grid-template-columns:1fr 1fr 1.3fr 1fr;
  gap:30px;
  padding:45px 0
}

.footer-grid>div>a {
  display:block;
  width:fit-content;
  font-size:.875rem;
  padding:3px 0;
  color:#c4cbbe
}

.footer-grid>div>a:hover {
  color:white
}

.footer-grid .kicker {
  margin-bottom:18px;
  color:#fff;
  font-size:.75rem
}

.footer-grid p {
  font-size:.875rem;
  color:#b7beb2;
  margin-top:15px
}

.footer-grid .line-link {
  margin-top:18px
}

.footer-bottom {
  border-top:1px solid #ffffff2b;
  padding-top:22px;
  display:flex;
  justify-content:space-between;
  font-size:.75rem;
  color:#a2aa9d;
  gap:20px
}

.breadcrumb {
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  font-size:.75rem;
  color:var(--muted);
  padding-bottom:35px
}

.breadcrumb a:hover,.breadcrumb>span:last-child {
  color:var(--ink)
}

.page-intro {
  padding-top:45px;
  padding-bottom:70px
}

.page-title {
  display:flex;
  justify-content:space-between;
  align-items:end;
  gap:35px
}

.page-title .kicker {
  margin-bottom:25px
}

.page-title>p {
  max-width:400px;
  font-size:.9375rem;
  color:var(--muted);
  padding-bottom:7px
}

.page-title sup {
  vertical-align:top;
  font-size:1rem;
  letter-spacing:0;
  font-weight:400;
  margin-left:16px;
  display:inline-block;
  padding-top:12px
}

.archive {
  padding-bottom:85px
}

.archive-toolbar {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:25px;
  padding:23px 0;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line)
}

.filter-links {
  display:flex;
  gap:28px;
  flex-wrap:wrap
}

.filter-links a {
  font-size:.875rem;
  color:var(--muted);
  padding:5px 0;
  border-bottom:1px solid transparent
}

.filter-links a[aria-current] {
  color:var(--ink);
  border-color:var(--ink)
}

.filter-links small {
  vertical-align:super;
  font-size:.75rem;
  margin-left:5px
}

.search {
  border-bottom:1px solid var(--line);
  display:flex;
  align-items:center;
  min-width:160px;
  max-width:220px
}

.search input {
  font-size:.875rem;
  border:0;
  background:transparent;
  padding:8px 0;
  width:100%;
  min-width:0;
  color:var(--ink)
}

.search>span:last-child {
  font-size:1.6rem;
  padding-left:8px
}

.archive-info {
  display:flex;
  justify-content:space-between;
  font-size:.75rem;
  color:var(--muted);
  padding:23px 0;
  gap:20px
}

.archive-info>span:last-child {
  letter-spacing:.1em;
  font-size:.75rem
}

.archive-grid {
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:36px 23px
}

.archive-grid .card-title h3 {
  font-size:1.2rem
}

.archive-grid .card-image>img {
  aspect-ratio:1.25
}

.archive-grid .card-open {
  display:none
}

#no-results {
  padding:70px 0
}

#no-results p {
  margin:20px 0
}

.project-intro {
  padding-top:40px;
  padding-bottom:40px
}

.project-intro .kicker {
  margin-bottom:18px;
  color:var(--muted)
}

.project-title-row {
  display:flex;
  justify-content:space-between;
  align-items:end;
  gap:40px
}

.project-title-row h1 {
  font-size:clamp(2.8rem,5.5vw,6rem);
  max-width:1000px
}

.project-title-row .line-link {
  white-space:nowrap;
  flex-shrink:0
}

.gallery-trigger {
  position:relative;
  width:100%;
  padding:0;
  background:#e7e9e3;
  border:0;
  display:block;
  text-align:left;
  overflow:hidden
}

.cover-trigger img {
  width:100%;
  max-height:80svh;
  object-fit:cover;
  aspect-ratio:1.8
}

.zoom-label {
  position:absolute;
  right:18px;
  bottom:18px;
  background:#fff;
  padding:10px 15px;
  display:flex;
  gap:22px;
  align-items:center;
  font-size:.75rem;
  letter-spacing:.06em;
  color:var(--ink)
}

.zoom-label b {
  font-size:1.25rem;
  font-weight:400;
  line-height:1
}

.project-story {
  display:grid;
  grid-template-columns:1fr 2fr;
  gap:11%;
  padding-top:75px;
  padding-bottom:90px
}

.project-story dl {
  margin:25px 0 0
}

.project-story dl>div {
  padding:14px 0;
  border-bottom:1px solid var(--line);
  display:grid;
  grid-template-columns:1fr 1.4fr;
  gap:15px;
  font-size:.875rem
}

.project-story dt {
  color:var(--muted)
}

.project-story dd {
  margin:0
}

.project-story h2 {
  margin:23px 0 25px
}

.project-description {
  color:var(--muted);
  max-width:750px;
  font-size:1rem
}

.project-story .line-link {
  margin-top:30px
}

.gallery-section {
  padding-bottom:65px
}

.gallery-total {
  font-size:.75rem;
  color:var(--muted);
  letter-spacing:.12em
}

.gallery-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:40px 25px
}

.gallery-item.full {
  grid-column:1/-1
}

.gallery-item img {
  width:100%;
  height:auto;
  aspect-ratio:1.3;
  object-fit:cover;
  transition:transform .5s
}

.gallery-item.full img {
  aspect-ratio:1.85
}

.gallery-trigger:hover img {
  transform:scale(1.02)
}

.gallery-item figcaption {
  display:flex;
  justify-content:space-between;
  gap:20px;
  font-size:.75rem;
  color:var(--muted);
  padding-top:12px
}

.project-pagination {
  display:grid;
  grid-template-columns:1fr auto 1fr;
  gap:40px;
  padding-top:40px;
  padding-bottom:40px;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line)
}

.project-pagination>a {
  align-self:center
}

.project-pagination a:last-child {
  text-align:right
}

.project-pagination small {
  font-size:.75rem;
  letter-spacing:.1em;
  color:var(--muted);
  display:block;
  margin-bottom:10px
}

.project-pagination span {
  font-size:1.4rem;
  line-height:1.3;
  display:block
}

.project-pagination a:hover {
  color:var(--accent)
}

.all-projects {
  font-size:.875rem;
  border-bottom:1px solid;
  padding-bottom:5px
}

.related {
  padding-top:90px;
  padding-bottom:90px
}

.related h2 {
  font-size:2.3rem
}

.project-grid.three {
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:25px
}

.three .card-title h3 {
  font-size:1.2rem
}

.sub-hero {
  height:620px;
  min-height:400px;
  position:relative;
  overflow:hidden;
  background:#252c24;
  color:white
}

.sub-hero>img {
  position:absolute;
  width:100%;
  height:100%;
  object-fit:cover
}

.sub-hero>div:last-child {
  position:relative;
  padding:130px var(--gutter) 60px;
  max-width:1300px
}

.sub-hero h1 {
  margin:30px 0 20px
}

.sub-hero>div>p:last-child {
  font-size:1rem;
  color:#e1e5dd
}

.values {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:40px;
  padding-bottom:100px
}

.values article {
  border-top:1px solid var(--line);
  padding-top:25px
}

.values span {
  font-size:.75rem;
  color:var(--muted)
}

.values h3 {
  margin:35px 0 20px
}

.values p {
  color:var(--muted);
  font-size:.9375rem
}

.team-teaser {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8%;
  padding-top:70px;
  padding-bottom:70px;
  background:var(--soft)
}

.team-teaser img {
  width:100%;
  height:500px;
  object-fit:cover
}

.team-teaser>div:last-child {
  align-self:center
}

.team-teaser h2 {
  margin:25px 0
}

.team-teaser p:not(.kicker) {
  color:var(--muted)
}

.team-teaser .line-link {
  margin-top:25px
}

.team-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:50px;
  padding-bottom:80px
}

.team-grid article>img {
  width:100%;
  aspect-ratio:1;
  object-fit:cover;
  object-position:top;
  background:var(--soft)
}

.team-grid article>div {
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:20px;
  padding:25px 0;
  border-bottom:1px solid var(--line)
}

.team-grid h2 {
  font-size:2rem
}

.team-grid span {
  font-size:.875rem;
  color:var(--muted)
}

.team-note {
  max-width:900px;
  padding-top:30px;
  padding-bottom:40px
}

.team-note h2 {
  margin:25px 0
}

.team-note p:not(.kicker) {
  color:var(--muted)
}

.team-note .line-link {
  margin-top:25px
}

.service-cards {
  padding-bottom:40px
}

.service-card {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:7%;
  padding-bottom:70px;
  margin-bottom:70px;
  border-bottom:1px solid var(--line)
}

.service-card:nth-child(2)>div:first-child {
  order:2
}

.service-card>div:first-child {
  overflow:hidden
}

.service-card img {
  width:100%;
  height:480px;
  object-fit:cover;
  transition:transform .5s
}

.service-card:hover img {
  transform:scale(1.025)
}

.service-card>div:last-child {
  align-self:center
}

.service-card h2 {
  font-size:clamp(2rem,3vw,3.5rem);
  margin:25px 0
}

.service-card p:not(.kicker) {
  color:var(--muted)
}

.service-card .line-link {
  margin-top:25px
}

.service-detail {
  padding-top:40px;
  padding-bottom:80px
}

.service-detail .intro {
  padding-top:45px;
  padding-bottom:70px
}

.lead {
  font-size:1.15rem;
  color:var(--muted);
  margin-top:30px
}

.service-scope {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:30px
}

.service-scope article {
  border-top:1px solid var(--line);
  padding-top:25px
}

.service-scope h3 {
  font-size:1.35rem;
  margin:30px 0 18px
}

.service-scope p {
  font-size:.9375rem;
  color:var(--muted)
}

.process-steps {
  padding-bottom:40px
}

.process-steps article {
  display:grid;
  grid-template-columns:1fr 2.5fr;
  gap:7%;
  border-top:1px solid var(--line);
  padding:50px 0 60px
}

.step-number {
  font-size:5rem;
  font-weight:400;
  line-height:1;
  color:#a0a69b;
  letter-spacing:-.05em
}

.process-steps h3 {
  font-size:1.2rem;
  margin:25px 0 15px
}

.process-steps p {
  color:var(--muted);
  max-width:700px
}

.step-tags {
  display:block;
  margin-top:30px;
  font-size:.75rem;
  word-spacing:4px;
  color:var(--muted)
}

.faq {
  display:grid;
  grid-template-columns:1fr 1.5fr;
  gap:7%;
  padding-top:65px;
  padding-bottom:70px;
  background:var(--soft)
}

.faq h2 {
  margin-top:23px
}

.faq details {
  border-top:1px solid #c0c6bb;
  padding:22px 0
}

.faq details:last-child {
  border-bottom:1px solid #c0c6bb
}

.faq summary {
  cursor:pointer;
  list-style:none;
  font-size:1rem;
  position:relative;
  padding-right:30px
}

.faq summary::-webkit-details-marker {
  display:none
}

.faq summary:after {
  content:'+';
  position:absolute;
  right:0;
  top:0;
  font-size:1.3rem;
  font-weight:400;
  line-height:1.3
}

.faq details[open] summary:after {
  content:'−'
}

.faq details p {
  font-size:.9375rem;
  color:var(--muted);
  padding-top:18px
}

.contact-layout {
  display:grid;
  grid-template-columns:1fr 1.2fr;
  gap:9%;
  padding-bottom:100px
}

.contact-details {
  display:grid;
  grid-template-columns:1fr;
  gap:28px;
  align-content:start
}

.contact-details article {
  border-top:1px solid var(--line);
  padding-top:24px
}

.contact-details .kicker {
  color:var(--muted);
  margin-bottom:12px
}

.contact-large {
  font-size:clamp(1.3rem,2vw,2rem);
  letter-spacing:-.03em
}

.contact-details .line-link {
  margin-top:13px;
  width:fit-content
}

.contact-form {
  padding:38px;
  background:var(--soft)
}

.contact-form h2 {
  font-size:2.2rem
}

.contact-form>p {
  font-size:.875rem;
  color:var(--muted);
  margin:15px 0 30px
}

.contact-form label {
  display:block;
  font-size:.875rem;
  font-weight:500;
  margin-bottom:22px
}

.contact-form label>span {
  font-weight:400;
  color:var(--muted);
  font-size:.75rem
}

.contact-form input,.contact-form select,.contact-form textarea {
  display:block;
  width:100%;
  min-height:45px;
  margin-top:8px;
  background:transparent;
  border:0;
  border-bottom:1px solid #abb3a5;
  padding:9px 0;
  border-radius:0;
  color:var(--ink);
  font-size:1rem
}

.contact-form textarea {
  resize:vertical
}

.form-row {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:24px
}

.contact-form .button {
  width:100%
}

#form-status {
  font-size:.875rem;
  color:var(--muted);
  margin-top:20px
}

.not-found {
  padding-top:100px;
  padding-bottom:130px
}

.not-found h1 {
  margin:25px 0
}

.not-found p {
  margin-bottom:30px
}

.not-found .line-link {
  margin-left:30px
}

.lightbox {
  inset:0;
  margin:auto;
  width:100vw;
  max-width:none;
  height:100dvh;
  max-height:none;
  border:0;
  background:#141714;
  color:#fff;
  padding:0;
  overflow:hidden
}

.lightbox::backdrop {
  background:#141714
}

.lightbox[open] {
  display:grid;
  grid-template-rows:auto minmax(0,1fr) auto auto
}

.lightbox-bar {
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:15px 25px;
  gap:20px;
  font-size:.875rem;
  border-bottom:1px solid #ffffff25
}

.lightbox button {
  background:none;
  color:white;
  border:0
}

.lightbox-bar button {
  font-size:.875rem;
  display:flex;
  gap:25px;
  align-items:center;
  min-height:40px
}

.lightbox-bar button>span {
  font-size:1.8rem;
  line-height:1
}

.lightbox-stage {
  min-height:0;
  display:flex;
  justify-content:center;
  align-items:center;
  padding:15px
}

.lightbox-stage img {
  max-width:100%;
  max-height:100%;
  width:auto;
  height:auto;
  object-fit:contain;
  touch-action:pan-y
}

.lightbox-controls {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:40px;
  padding:8px 15px;
  font-size:.875rem
}

.lightbox-controls button {
  padding:10px;
  min-height:44px
}

.lightbox-controls>span {
  font-size:.75rem;
  color:#c8cfc1
}

.lightbox-thumbs {
  display:flex;
  gap:9px;
  overflow-x:auto;
  padding:10px 25px 20px
}

.lightbox-thumbs button {
  padding:0;
  flex:0 0 65px;
  opacity:.5;
  border:1px solid transparent
}

.lightbox-thumbs button[aria-current=true] {
  opacity:1;
  border-color:white
}

.lightbox-thumbs img {
  width:65px;
  height:47px;
  object-fit:cover
}

.gallery-open {
  overflow:hidden
}


@media(min-width:1800px) {
  :root {
  --gutter:max(6vw,calc((100vw - 1550px)/2))
}

.wrap {
  max-width:none
}


}

@media(max-width:1100px) {
  .desktop-nav {
  gap:22px
}

.header .brand img {
  width:180px
}

.project-title-row {
  flex-wrap:wrap;
  gap:22px
}

.page-title {
  display:block
}

.page-title>p {
  margin-top:25px;
  max-width:600px
}

.archive-toolbar {
  align-items:start;
  flex-direction:column
}

.search {
  max-width:none;
  width:100%
}

.project-story {
  gap:7%
}

.footer-grid {
  grid-template-columns:1fr 1fr;
  gap:35px 50px
}

.home-services {
  gap:5%
}

.service-links h3 {
  font-size:1.5rem
}

.service-scope {
  grid-template-columns:1fr 1fr
}

.contact-layout {
  gap:5%
}

.contact-form {
  padding:28px
}

.form-row {
  grid-template-columns:1fr;
  gap:0
}

.team-grid article>div {
  display:block
}

.team-grid span {
  display:block;
  margin-top:10px
}


}

@media(max-width:850px) {
  .header {
  height:80px;
  padding:0 6%
}

.desktop-nav {
  display:none
}

.menu-toggle {
  display:flex
}

.home-hero {
  height:calc(100svh - 80px);
  min-height:610px
}

.hero-copy {
  padding-top:110px
}

.hero-copy h1 {
  font-size:clamp(3.5rem,8vw,5rem)
}

.hero-location {
  display:none
}

.intro {
  grid-template-columns:1fr;
  padding-top:75px;
  padding-bottom:75px;
  gap:25px
}

.archive-grid {
  grid-template-columns:repeat(2,minmax(0,1fr))
}

.editorial-grid {
  column-gap:30px
}

.editorial-grid .project-card:nth-child(2n) {
  padding-top:60px
}

.home-services {
  grid-template-columns:1fr;
  padding-top:70px;
  padding-bottom:70px;
  gap:35px
}

.home-services h2 br {
  display:none
}

.process-teaser-copy {
  padding:50px 10%
}

.process-teaser-copy h2 {
  font-size:2.5rem
}

.cta {
  padding-top:70px;
  padding-bottom:70px
}

.cta>div {
  align-items:start;
  flex-direction:column;
  gap:30px
}

.footer-top {
  flex-wrap:wrap
}

.footer-top p {
  order:3;
  width:100%
}

.footer-bottom>span:nth-child(2) {
  display:none
}

.page-intro {
  padding-top:30px;
  padding-bottom:45px
}

.project-story {
  grid-template-columns:1fr;
  gap:50px;
  padding-top:40px;
  padding-bottom:65px
}

.project-story aside dl {
  display:grid;
  grid-template-columns:1fr 1fr;
  column-gap:35px
}

.project-story dl>div {
  display:block
}

.project-story dd {
  margin-top:6px
}

.project-grid.three {
  grid-template-columns:repeat(2,minmax(0,1fr))
}

.three .project-card:last-child {
  display:none
}

.sub-hero {
  height:530px
}

.sub-hero>div:last-child {
  padding-top:115px
}

.sub-hero h1 {
  font-size:3.5rem
}

.values {
  gap:25px
}

.team-teaser {
  gap:5%
}

.team-teaser img {
  height:450px
}

.team-teaser h2 {
  font-size:2.3rem
}

.service-card {
  gap:5%;
  padding-bottom:45px;
  margin-bottom:45px
}

.service-card img {
  height:400px
}

.service-card h2 {
  font-size:2.2rem
}

.faq {
  grid-template-columns:1fr;
  gap:35px
}

.contact-layout {
  grid-template-columns:1fr;
  gap:50px
}

.contact-details {
  grid-template-columns:1fr 1fr;
  gap:30px
}

.contact-large {
  font-size:1.35rem
}

.form-row {
  grid-template-columns:1fr 1fr;
  gap:24px
}


}

@media(max-width:560px) {
  :root {
  --gutter:6%
}

html {
  scroll-padding-top:92px
}

.header .brand img {
  width:167px
}

.hero-copy {
  padding-top:105px
}

.hero-copy .kicker {
  font-size:.75rem;
  letter-spacing:.03em
}

.hero-copy h1 {
  font-size:clamp(3.1rem,11vw,4rem);
  margin:30px 0 35px
}

.home-hero {
  min-height:620px
}

.hero-meta {
  bottom:22px;
  gap:18px
}

.hero-meta>div>a {
  font-size:.875rem
}

.hero-tabs {
  gap:2px
}

.hero-tabs button {
  padding:8px 12px;
  font-size:.875rem
}

.two-copy {
  grid-template-columns:1fr;
  gap:18px;
  margin-top:25px
}

.intro h2 {
  font-size:2.4rem
}

.intro {
  padding-top:60px;
  padding-bottom:65px
}

.section-heading {
  display:block;
  margin-bottom:30px
}

.section-heading h2 {
  font-size:2.25rem
}

.section-heading .line-link {
  margin-top:22px
}

.selected {
  padding-bottom:65px
}

.project-grid,.editorial-grid {
  grid-template-columns:1fr;
  gap:30px
}

.editorial-grid .project-card:nth-child(2n) {
  padding:0
}

.editorial-grid .project-card:nth-child(2n) .card-image>img {
  aspect-ratio:1.36
}

.card-open {
  opacity:1;
  transform:none
}

.card-title h3 {
  font-size:1.35rem
}

.service-links h3 {
  font-size:1.3rem;
  line-height:1.35
}

.home-services h2 br {
  display:block
}

.process-teaser {
  grid-template-columns:1fr
}

.process-teaser>div:first-child>img {
  height:380px;
  object-position:center
}

.process-teaser-copy {
  padding:55px 6%
}

.process-teaser-copy h2 {
  font-size:2.7rem
}

.cta h2 {
  font-size:2.25rem
}

.footer {
  padding-top:40px
}

.footer-top .brand img {
  width:170px
}

.footer-grid {
  grid-template-columns:1fr 1fr;
  gap:30px 18px;
  padding:35px 0
}

.footer-grid>div:nth-child(3),.footer-grid>div:last-child {
  grid-column:1/-1
}

.breadcrumb {
  padding-bottom:30px;
  gap:8px
}

.page-intro h1 {
  font-size:2.7rem
}

.page-title>p {
  font-size:.875rem
}

.page-title sup {
  font-size:.875rem;
  padding-top:8px
}

.filter-links {
  gap:12px 20px
}

.archive-toolbar {
  padding:18px 0
}

.archive-grid {
  grid-template-columns:1fr;
  gap:28px
}

.archive-grid .card-image>img {
  aspect-ratio:1.36
}

.archive-grid .card-title h3 {
  font-size:1.3rem
}

.archive-info>span:last-child {
  letter-spacing:0
}

.archive {
  padding-bottom:45px
}

.project-intro {
  padding-top:25px;
  padding-bottom:30px
}

.project-title-row h1 {
  font-size:2.7rem
}

.cover-trigger img {
  aspect-ratio:1.15;
  max-height:none
}

.zoom-label {
  right:10px;
  bottom:10px;
  gap:12px;
  padding:8px 12px
}

.project-story aside dl {
  column-gap:20px
}

.project-story h2 {
  font-size:2.3rem
}

.gallery-total {
  display:block;
  margin-top:20px
}

.gallery-grid {
  grid-template-columns:1fr;
  gap:27px
}

.gallery-item.full {
  grid-column:auto
}

.gallery-item.full img,.gallery-item img {
  aspect-ratio:auto;
  object-fit:contain;
  height:auto
}

.project-pagination {
  grid-template-columns:1fr 1fr;
  gap:25px;
  padding-top:30px;
  padding-bottom:30px
}

.project-pagination span {
  font-size:1.1rem
}

.project-pagination .all-projects {
  grid-row:2;
  grid-column:1/-1;
  justify-self:center
}

.related {
  padding-top:60px;
  padding-bottom:60px
}

.related h2 {
  font-size:2rem
}

.project-grid.three {
  grid-template-columns:1fr
}

.three .project-card:last-child {
  display:block
}

.sub-hero {
  height:490px
}

.sub-hero h1 {
  font-size:3rem
}

.sub-hero>div:last-child {
  padding-top:100px
}

.values {
  grid-template-columns:1fr;
  gap:35px;
  padding-bottom:60px
}

.values h3 {
  margin-top:22px
}

.team-teaser {
  grid-template-columns:1fr;
  gap:35px;
  padding-top:40px;
  padding-bottom:50px
}

.team-teaser img {
  height:350px
}

.team-grid {
  grid-template-columns:1fr;
  gap:40px;
  padding-bottom:55px
}

.team-grid h2 {
  font-size:1.7rem
}

.team-grid article>div {
  display:flex
}

.team-grid span {
  margin:0
}

.service-card {
  grid-template-columns:1fr;
  gap:30px
}

.service-card:nth-child(2)>div:first-child {
  order:0
}

.service-card img {
  height:330px
}

.service-card h2 {
  font-size:2.1rem
}

.service-scope {
  grid-template-columns:1fr;
  gap:35px
}

.service-scope h3 {
  margin-top:20px
}

.service-detail {
  padding-bottom:25px
}

.service-detail .intro {
  padding-top:20px;
  padding-bottom:40px
}

.lead {
  font-size:1rem
}

.process-steps article {
  grid-template-columns:50px 1fr;
  gap:20px;
  padding:35px 0 40px
}

.step-number {
  font-size:2.7rem
}

.process-steps h2 {
  font-size:2.1rem
}

.process-steps h3 {
  font-size:1.1rem;
  margin-top:20px
}

.process-steps p {
  font-size:.9375rem
}

.step-tags {
  word-spacing:0
}

.faq {
  padding-top:45px;
  padding-bottom:45px
}

.faq h2 {
  font-size:2.2rem
}

.contact-details {
  grid-template-columns:1fr
}

.contact-large {
  font-size:1.7rem
}

.contact-form {
  padding:30px 22px
}

.contact-form h2 {
  font-size:2rem
}

.form-row {
  grid-template-columns:1fr;
  gap:0
}

.contact-layout {
  padding-bottom:65px
}

.lightbox-bar {
  padding:10px 15px
}

.lightbox-bar button {
  gap:10px
}

.lightbox-stage {
  padding:5px
}

.lightbox-controls {
  gap:10px
}

.lightbox-thumbs {
  padding:10px 15px 15px
}

.not-found {
  padding-top:65px;
  padding-bottom:85px
}

.not-found h1 {
  font-size:2.7rem
}

.not-found .line-link {
  display:table;
  margin:22px 0 0
}


}

@media(prefers-reduced-motion:reduce) {
  html {
  scroll-behavior:auto
}

*,*:before,*:after {
  transition:none!important
}


}



/* Mobil kullanım ve kurumsal proje sunumu */
:root { --soft: #f5f4f0; --line: #dedfd8; }
.card-title { flex-wrap: wrap; }
.card-company { flex-basis: 100%; font-size: .75rem; letter-spacing: .045em; color: #62685f; margin-bottom: 6px; }
.project-context { margin-top: 28px; padding-top: 24px; border-top: 1px solid var(--line); }
.project-context h3 { margin: 22px 0 12px; font-size: 1.2rem; letter-spacing: -.02em; }
.project-context p, .project-context li { font-size: .9375rem; color: #5e665d; }
.project-context a { text-decoration: underline; text-underline-offset: 4px; }
.project-context ul { padding-left: 20px; }
.project-context li { margin: 8px 0; }
.seo-breadcrumb { padding-top: 28px; }
.hero-tabs button { min-width: 48px; min-height: 48px; }
.lightbox { width: 100%; max-width: 100%; overscroll-behavior: contain; }
.lightbox > * { min-width: 0; }
.lightbox-thumbs { scrollbar-width: thin; max-width: 100%; }
.lightbox-thumbs button { min-height: 48px; }
.lightbox-bar button { min-width: 84px; min-height: 48px; }
.lightbox-controls button { min-height: 48px; }
.project-pagination a { min-height: 48px; padding: 8px 0; }
.search input { font-size: 16px; min-height: 48px; }
.mobile-menu { overscroll-behavior: contain; }
.mobile-menu a { min-height: 48px; }
.mobile-quick-contact { display: none; }
.service-faq { padding-top: 45px; padding-bottom: 65px; }
.service-faq h2 { font-size: clamp(1.7rem, 3vw, 2.6rem); margin-bottom: 24px; }
.service-faq details { border-top: 1px solid var(--line); padding: 18px 0; }
.service-faq summary { cursor: pointer; font-weight: 600; min-height: 36px; }
.service-faq details p { max-width: 75ch; margin: 18px 0 0; color: #5e665d; }
@media (max-width: 850px) {
  html { scroll-padding-top: 90px; }
  .header { height: 72px; padding: 0 6%; }
  .mobile-menu { top: 72px; }
  .mobile-menu > a { font-size: clamp(1.6rem, 6.8vw, 2.25rem); padding: 11px 0; }
  .mobile-contact a { display: inline-flex; align-items: center; }
  .home-hero { height: calc(100svh - 72px); min-height: 540px; max-height: 780px; }
  .hero-copy { padding-top: clamp(65px, 12svh, 120px); }
  .hero-copy h1 { font-size: clamp(2.7rem, 10.5vw, 4.5rem); max-width: 14ch; }
  .hero-meta { align-items: center; }
  .archive-toolbar { gap: 14px; padding: 16px 0; }
  .filter-links { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; width: 100%; }
  .filter-links a { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 48px; padding: 9px 12px; border: 1px solid var(--line); font-size: .8125rem; }
  .filter-links a[aria-current] { background: var(--ink); color: white; border-color: var(--ink); }
  .filter-links a[aria-current] small { color: #d9ded4; }
  .search { border: 1px solid var(--line); padding: 0 12px; background: #fafaf7; }
  .breadcrumb { font-size: .75rem; line-height: 1.8; flex-wrap: wrap; }
  .project-title-row h1 { font-size: clamp(2rem, 8.5vw, 3.5rem); overflow-wrap: break-word; }
  .project-title-row { gap: 20px; }
  .project-story dl > div { padding: 13px 0; }
  .project-story dd { overflow-wrap: anywhere; }
  .lightbox-bar { padding-top: max(10px, env(safe-area-inset-top)); }
  .lightbox-thumbs { padding-bottom: max(15px, env(safe-area-inset-bottom)); }
  .lightbox-controls { gap: 8px; justify-content: space-between; }
  .lightbox-controls button { font-size: .8125rem; padding: 10px 12px; }
  .footer-grid a { display: flex; align-items: center; min-height: 44px; }
  .footer-bottom a { display: inline-flex; align-items: center; min-height: 44px; }
  .contact-form input, .contact-form select, .contact-form textarea { font-size: 16px; min-height: 48px; }
}
@media (max-width: 560px) {
  .hero-copy .kicker { max-width: 28ch; line-height: 1.8; }
  .hero-meta { left: 6%; right: 6%; }
  .hero-meta > div:first-child { max-width: 54%; }
  .hero-tabs button { min-width: 42px; padding: 8px 10px; }
  .project-story aside dl { grid-template-columns: 1fr 1fr; }
  .project-cover.wrap { padding-left: 0; padding-right: 0; }
  .project-cover .cover-trigger img { aspect-ratio: 1.12; }
  .gallery-grid { gap: 30px; }
  .project-description, .project-context p { font-size: 1rem; line-height: 1.85; }
  .page-intro { padding-bottom: 28px; }
  .page-title > p { margin-top: 18px; line-height: 1.8; }
  .project-intro .kicker { font-size: .6875rem; line-height: 1.9; }
  .card-image { background: #e6e8e1; }
  .card-open { padding: 8px 12px; }
  .service-faq { padding-top: 24px; padding-bottom: 42px; }
}
@media (max-width: 360px) {
  .header .brand img { width: 150px; }
  .hero-copy h1 { font-size: 2.6rem; }
  .filter-links a { padding: 8px; font-size: .75rem; }
}

/* Dar ekranlarda uzun süreç başlıkları */
.process-steps article > div { min-width: 0; }
.process-steps h2 { overflow-wrap: anywhere; }