/* MFE Mimarlık — Hizmetler. Yerel fontlar, saf HTML/CSS, JavaScript yok. */
@font-face { font-family: "Poppins"; src: url("/assets/hizmetler/fonts/Poppins-Regular.ttf") format("truetype"); font-style: normal; font-weight: 400; font-display: swap; }
@font-face { font-family: "Poppins"; src: url("/assets/hizmetler/fonts/Poppins-Medium.ttf") format("truetype"); font-style: normal; font-weight: 500; font-display: swap; }
@font-face { font-family: "Poppins"; src: url("/assets/hizmetler/fonts/Poppins-SemiBold.ttf") format("truetype"); font-style: normal; font-weight: 600; font-display: swap; }
@font-face { font-family: "Poppins"; src: url("/assets/hizmetler/fonts/Poppins-Bold.ttf") format("truetype"); font-style: normal; font-weight: 700; font-display: swap; }
@font-face {
  font-family: "Manrope";
  src: url("/assets/hizmetler/fonts/Manrope-Variable.ttf") format("truetype");
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
}

:root {
  /* Referans genişliği: 725 px. Masaüstü oranları bu ölçüye göre ölçeklenir. */
  --u: min(0.1379310345vw, 2.648276px);
  --orange: #ff5b0b;
  --ink: #111722;
  --muted: #80838b;
  --paper: #faf9f7;
  --gold: #b47837;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 16px; }
body { margin: 0; background: var(--paper); color: var(--ink); font: 400 calc(13 * var(--u))/1.32 "Poppins", Arial, sans-serif; -webkit-font-smoothing: antialiased; }
h1, h2, h3, p, ul, ol { margin: 0; }
ul, ol { padding: 0; list-style: none; }
h1, h2, h3 { font-weight: 600; letter-spacing: -.045em; }
h2 { font-size: calc(28 * var(--u)); line-height: 1.06; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
a, summary { -webkit-tap-highlight-color: transparent; touch-action: manipulation; }
a:focus-visible, summary:focus-visible { outline: 2px solid var(--orange); outline-offset: 5px; }
::selection { background: var(--orange); color: #fff; }
.wrap { width: calc(659 * var(--u)); margin-inline: auto; }
.wide { width: calc(683 * var(--u)); margin-inline: auto; }
.eyebrow { display: flex; align-items: center; gap: calc(8 * var(--u)); color: #858891; font-size: calc(8 * var(--u)); font-weight: 600; line-height: 1.2; text-transform: uppercase; letter-spacing: .16em; }
.eyebrow::before { content: ""; flex: 0 0 calc(20 * var(--u)); height: calc(1.7 * var(--u)); background: var(--orange); }
.button { display: inline-flex; align-items: center; justify-content: center; gap: calc(14 * var(--u)); width: calc(164 * var(--u)); min-height: calc(33 * var(--u)); border: 1px solid #e5530a; border-radius: calc(5 * var(--u)); background: linear-gradient(115deg, #ff6511, #ff5103); color: #11130e; font-size: calc(12.5 * var(--u)); font-weight: 600; letter-spacing: -.035em; line-height: 1.1; }
.button .icon { font-size: calc(16 * var(--u)); }
.button:hover { background: #ff752b; }
.skip-link { position: fixed; top: -100px; left: 16px; z-index: 100; padding: 12px 18px; background: white; color: var(--ink); font-size: 16px; }
.skip-link:focus { top: 12px; }

/* Logo: metin ve mimari işaret tamamen HTML/CSS ile çizilir. */
.brand { display: inline-flex; align-items: center; width: calc(99 * var(--u)); color: #f5f5f3; line-height: 1; }
.brand-mark { position: relative; display: block; flex: 0 0 calc(27 * var(--u)); height: calc(37 * var(--u)); }
.brand-mark i { position: absolute; left: 16%; top: 12%; width: 37%; height: 73%; background: var(--orange); clip-path: polygon(0 18%, 100% 0, 100% 94%, 0 100%, 0 18%, 22% 28%, 22% 91%, 72% 87%, 72% 14%, 22% 28%); }
.brand-mark b { position: absolute; top: 4%; left: 63%; width: 27%; height: 84%; background: #f3f3ef; clip-path: polygon(0 0, 100% 16%, 100% 100%, 0 88%); }
.brand-mark em { position: absolute; left: 0; right: 0; bottom: 10%; height: 3%; background: #f5f5ef; transform: rotate(-6deg); }
.brand-name { font-family: "Manrope", Arial, sans-serif; font-size: calc(31 * var(--u)); font-weight: 450; letter-spacing: -.065em; }
.brand-name small { display: block; text-align: right; font-size: calc(7.7 * var(--u)); font-weight: 800; letter-spacing: -.065em; margin-top: calc(-1 * var(--u)); }

.hero { position: relative; height: calc(339 * var(--u)); color: #f7f5f2; background: #111310; overflow: hidden; isolation: isolate; }
.hero-background { position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, #08100bc2, #08100b55 38%, transparent 52%), var(--mfe-bg-47a00d5f095b, url("/api/image?src=%2Fassets%2Fhizmetler%2Fimages%2Fhero-background.webp&w=1920&p=background&d=desktop")) center / 100% 100% no-repeat; }
.header { width: calc(670 * var(--u)); margin-left: calc(33 * var(--u)); margin-right: auto; height: calc(52 * var(--u)); padding-top: calc(7 * var(--u)); display: flex; align-items: flex-start; position: relative; z-index: 4; }
.header .brand { margin-left: calc(10 * var(--u)); margin-right: calc(64 * var(--u)); }
.desktop-nav { flex: 1; height: calc(33 * var(--u)); display: flex; align-items: stretch; justify-content: space-evenly; border: 1px solid #866237; border-radius: calc(4 * var(--u)); background: #111614b3; }
.desktop-nav a { display: flex; align-items: center; position: relative; color: #e2e1dc; font-size: calc(10 * var(--u)); letter-spacing: -.04em; }
.desktop-nav a.active { color: #d8ab69; font-weight: 750; }
.desktop-nav a.active::after { content: ""; position: absolute; bottom: -1px; left: calc(-3 * var(--u)); right: calc(-3 * var(--u)); height: calc(2 * var(--u)); background: var(--orange); }
.header-cta { flex: 0 0 calc(118 * var(--u)); margin-left: calc(13 * var(--u)); font-size: calc(11 * var(--u)); gap: calc(10 * var(--u)); }
.header-cta .icon { font-size: calc(13 * var(--u)); }
.mobile-menu { display: none; }
.breadcrumb { position: absolute; top: calc(58 * var(--u)); left: 50%; transform: translateX(-50%); display: flex; align-items: center; gap: calc(5 * var(--u)); font-size: calc(9 * var(--u)); color: #d2d2ce; letter-spacing: -.045em; }
.hero-copy { position: absolute; top: calc(101 * var(--u)); left: 50%; transform: translateX(-50%); }
.hero-copy .eyebrow { color: #d5d5cc; margin-bottom: calc(10 * var(--u)); }
.hero h1 { font-size: calc(31.8 * var(--u)); font-weight: 600; line-height: .99; letter-spacing: -.04em; transform: scaleX(.92); transform-origin: left; }
.hero h1 span { color: var(--orange); }
.hero-description { margin-top: calc(4 * var(--u)); font-size: calc(13 * var(--u)); line-height: 1.24; letter-spacing: -.03em; color: #d8d8d5; }
.hero-copy .button { margin-top: calc(11 * var(--u)); }
.concept-caption { position: absolute; right: calc(18 * var(--u)); bottom: calc(8 * var(--u)); font-size: calc(8 * var(--u)); color: #c5c1b9; letter-spacing: -.05em; }

.service-areas { height: calc(378 * var(--u)); background: linear-gradient(110deg, #faf9f7, #ffffff 60%, #f8f7f5); padding-top: calc(23 * var(--u)); }
.section-heading { display: grid; grid-template-columns: calc(467 * var(--u)) 1fr; align-items: start; }
.section-heading .eyebrow { margin-bottom: calc(6 * var(--u)); }
.section-heading h2 { font-size: calc(31 * var(--u)); letter-spacing: -.05em; transform: scaleX(.91); transform-origin: left; }
.section-heading > p { font-size: calc(12 * var(--u)); line-height: 1.3; letter-spacing: -.045em; color: var(--muted); width: calc(226 * var(--u)); white-space: nowrap; transform: scaleX(.93); transform-origin: left; }
.area-grid { display: grid; grid-template-columns: 222fr 220fr 220fr; gap: calc(11 * var(--u)); margin-top: calc(12 * var(--u)); }
.area-card { min-width: 0; }
.area-photo { display: block; height: calc(172 * var(--u)); overflow: hidden; }
.area-photo img { width: 100%; height: 100%; object-fit: cover; }
.area-copy { padding: calc(9 * var(--u)) calc(12 * var(--u)) 0; }
.area-copy h3 { font-size: calc(16 * var(--u)); line-height: 1.14; letter-spacing: -.055em; white-space: nowrap; transform: scaleX(.96); transform-origin: left; }
.area-copy > p { min-height: calc(48 * var(--u)); margin-top: calc(7 * var(--u)); font-size: calc(12 * var(--u)); line-height: 1.28; letter-spacing: -.045em; color: var(--muted); width: calc(224 * var(--u)); white-space: nowrap; transform: scaleX(.91); transform-origin: left; }
.text-link { display: inline-flex; align-items: center; gap: calc(9 * var(--u)); margin-top: calc(1 * var(--u)); font-size: calc(11 * var(--u)); font-weight: 800; letter-spacing: -.055em; }
.text-link > span:first-child { border-bottom: 1px solid #b38655; padding-bottom: calc(2 * var(--u)); }
.text-link .icon { color: var(--orange); font-size: calc(13 * var(--u)); }

.services { height: calc(206 * var(--u)); display: grid; grid-template-columns: calc(219 * var(--u)) 1fr; gap: calc(13 * var(--u)); padding-top: calc(20 * var(--u)); }
.services-intro .eyebrow { margin-bottom: calc(10 * var(--u)); }
.services-intro h2 { font-size: calc(28 * var(--u)); line-height: 1.02; letter-spacing: -.05em; white-space: nowrap; width: calc(280 * var(--u)); transform: scaleX(.84); transform-origin: left; }
.services-intro > p:last-child { margin-top: calc(17 * var(--u)); color: var(--muted); font-size: calc(15 * var(--u)); line-height: 1.28; letter-spacing: -.035em; width: calc(260 * var(--u)); white-space: nowrap; transform: scaleX(.87); transform-origin: left; }
.service-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: calc(86 * var(--u)) calc(80 * var(--u)); gap: calc(6 * var(--u)); }
.service-tile { display: flex; align-items: flex-start; gap: calc(11 * var(--u)); padding: calc(13 * var(--u)) calc(10 * var(--u)); border: 1px solid #e9c9b4; border-radius: calc(4 * var(--u)); background: #fdfbf82b; }
.service-tile > .icon { color: var(--orange); font-size: calc(29 * var(--u)); flex: 0 0 1em; }
.service-tile-copy { width: calc(91 * var(--u)); transform: scaleX(.88); transform-origin: left; }
.service-tile h3 { font-size: calc(10 * var(--u)); letter-spacing: -.04em; line-height: 1.1; white-space: nowrap; }
.service-tile p { margin-top: calc(7 * var(--u)); color: var(--muted); font-size: calc(10.2 * var(--u)); line-height: 1.22; letter-spacing: -.055em; white-space: nowrap; }
.service-tile:hover { border-color: var(--orange); background: #fff7f0; }

.project { display: grid; border-top: 1px solid #f0eeeb; overflow: hidden; }
.project--stand { height: calc(212 * var(--u)); grid-template-columns: 271fr 454fr; }
.project--interior { height: calc(203 * var(--u)); grid-template-columns: 440fr 285fr; }
.project--facade { height: calc(201 * var(--u)); grid-template-columns: 292fr 433fr; }
.project-photo { width: 100%; height: 100%; object-fit: cover; }
.project-copy { padding: calc(12 * var(--u)) calc(33 * var(--u)) 0; min-width: 0; }
.project--stand .project-copy { padding-right: calc(10 * var(--u)); }
.project-number { display: flex; align-items: center; gap: calc(12 * var(--u)); color: var(--orange); font-size: calc(18 * var(--u)); font-weight: 600; line-height: 1.3; }
.project-number::after { content: ""; width: calc(31 * var(--u)); height: calc(1.4 * var(--u)); background: var(--orange); }
.project h2 { margin-top: calc(7 * var(--u)); font-size: calc(26 * var(--u)); line-height: .97; white-space: nowrap; letter-spacing: -.055em; width: calc(260 * var(--u)); transform: scaleX(.84); transform-origin: left; }
.project-copy > p:not(.project-number) { margin-top: calc(10 * var(--u)); color: var(--muted); font-size: calc(13 * var(--u)); line-height: 1.24; letter-spacing: -.045em; width: calc(253 * var(--u)); white-space: nowrap; transform: scaleX(.95); transform-origin: left; }
.project-tags { display: flex; align-items: center; gap: calc(10 * var(--u)); margin-top: calc(18 * var(--u)); color: #626874; font-size: calc(10 * var(--u)); letter-spacing: -.055em; white-space: nowrap; }
.project-tags li + li::before { content: ""; display: inline-block; vertical-align: middle; width: calc(4 * var(--u)); height: calc(4 * var(--u)); border-radius: 50%; background: var(--orange); margin-right: calc(10 * var(--u)); }
.project--interior .project-copy { padding-top: calc(19 * var(--u)); padding-left: calc(30 * var(--u)); padding-right: calc(10 * var(--u)); }
.project--interior h2 { margin-top: calc(7 * var(--u)); }
.project--interior .project-tags { margin-top: calc(21 * var(--u)); }
.project--facade .project-copy { padding-top: calc(20 * var(--u)); padding-right: calc(10 * var(--u)); }
.project--facade .project-tags { margin-top: calc(25 * var(--u)); }

.process { height: calc(215 * var(--u)); padding-top: calc(25 * var(--u)); color: #f4f3f0; background: #101311 var(--mfe-bg-1923e3aa5df4, url("/api/image?src=%2Fassets%2Fhizmetler%2Fimages%2Fprocess-marble.webp&w=1920&p=background&d=desktop")) center / cover no-repeat; }
.process-heading { display: grid; grid-template-columns: 1fr 1fr; align-items: start; }
.process-heading .eyebrow { color: #c1c0b9; margin-bottom: calc(9 * var(--u)); }
.process h2 { font-size: calc(27 * var(--u)); line-height: 1.02; letter-spacing: -.04em; transform: scaleX(.92); transform-origin: left; }
.process-heading > p { padding-top: calc(17 * var(--u)); padding-left: calc(6 * var(--u)); font-size: calc(12 * var(--u)); line-height: 1.28; letter-spacing: -.04em; color: #d4d4d1; }
.process-steps { position: relative; display: grid; grid-template-columns: repeat(5, 1fr); margin-top: calc(7 * var(--u)); text-align: center; }
.process-steps::before { content: ""; position: absolute; height: 1px; top: calc(16 * var(--u)); left: calc(78 * var(--u)); right: calc(66 * var(--u)); background: #9d652a; }
.process-steps li { position: relative; z-index: 1; }
.step-number { display: flex; width: calc(33 * var(--u)); height: calc(33 * var(--u)); align-items: center; justify-content: center; margin-inline: auto; background: #111513; color: #d19a56; border: 1px solid #c48035; border-radius: 50%; font-size: calc(12 * var(--u)); font-weight: 600; }
.process-steps h3 { margin-top: calc(6 * var(--u)); font-size: calc(13 * var(--u)); font-weight: 650; letter-spacing: -.04em; }
.process-steps p { margin-top: calc(3 * var(--u)); color: #d2d2cd; font-size: calc(11 * var(--u)); line-height: 1.13; letter-spacing: -.04em; }

.contact { height: calc(207 * var(--u)); position: relative; overflow: hidden; isolation: isolate; color: #f7f7f3; border-block: 1px solid #b97b3e; background: #111512; }
.contact-background { position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, #08110a55, transparent 46%), var(--mfe-bg-812cee3d343f, url("/api/image?src=%2Fassets%2Fhizmetler%2Fimages%2Fcontact-background.webp&w=1920&p=background&d=desktop")) center / 100% 100% no-repeat; }
.contact-copy { padding-top: calc(17 * var(--u)); }
.contact .eyebrow { color: #d1d0c8; margin-bottom: calc(9 * var(--u)); }
.contact h2 { font-size: calc(27 * var(--u)); line-height: 1.02; letter-spacing: -.05em; transform: scaleX(.95); transform-origin: left; }
.contact-copy > p:not(.eyebrow) { font-size: calc(12 * var(--u)); line-height: 1.25; letter-spacing: -.02em; margin-top: calc(5 * var(--u)); color: #dddeda; }
.contact .button { margin-top: calc(8 * var(--u)); }
.phone-link { display: flex; align-items: center; gap: calc(8 * var(--u)); width: fit-content; margin-top: calc(9 * var(--u)); font-size: calc(10 * var(--u)); color: #dddcd8; letter-spacing: -.04em; }
.phone-link .icon { color: #d69a50; font-size: calc(17 * var(--u)); }
.phone-link strong { font-weight: 650; }

.footer { height: calc(209 * var(--u)); background: radial-gradient(ellipse at 50% 50%, #151715, #0c0e0e); color: #e2e3de; }
.footer-main { height: calc(158 * var(--u)); display: grid; grid-template-columns: calc(165 * var(--u)) calc(112 * var(--u)) calc(123 * var(--u)) calc(163 * var(--u)) 1fr; padding-top: calc(13 * var(--u)); }
.footer-brand > p { margin-top: calc(13 * var(--u)); color: #c7c8c3; font-size: calc(11 * var(--u)); line-height: 1.35; letter-spacing: -.04em; }
.footer-brand > .brand { margin-left: calc(7 * var(--u)); }
.social-links { display: flex; gap: calc(17 * var(--u)); margin-top: calc(14 * var(--u)); }
.social-links a { display: flex; font-size: calc(17 * var(--u)); }
.footer-nav, .footer-contact { display: flex; flex-direction: column; gap: calc(2 * var(--u)); padding-top: calc(9 * var(--u)); font-size: calc(10.5 * var(--u)); line-height: 1.35; letter-spacing: -.04em; }
.footer-main h3 { font-size: calc(11 * var(--u)); letter-spacing: -.045em; font-weight: 750; margin-bottom: calc(5 * var(--u)); }
.footer-contact { font-style: normal; }
.footer-contact a, .footer-contact p { display: flex; align-items: center; gap: calc(9 * var(--u)); font-size: calc(10 * var(--u)); white-space: nowrap; }
.footer-contact .icon { font-size: calc(13 * var(--u)); }
.footer-motto { align-self: start; margin-top: calc(7 * var(--u)); min-height: calc(119 * var(--u)); padding: calc(13 * var(--u)) 0 0 calc(26 * var(--u)); border-left: 1px solid #705534; font-size: calc(16 * var(--u)); line-height: 1.18; letter-spacing: -.05em; }
.footer-motto::before { content: ""; display: block; width: calc(25 * var(--u)); height: calc(1.8 * var(--u)); background: var(--orange); margin-bottom: calc(16 * var(--u)); }
.footer-bottom { display: flex; align-items: center; justify-content: space-between; padding-top: calc(19 * var(--u)); border-top: 1px solid #6f5235; font-size: calc(9 * var(--u)); color: #bbbeba; letter-spacing: -.04em; }
.footer-bottom nav { display: flex; gap: calc(12 * var(--u)); }
.footer-bottom nav > span { color: #a77a46; }
.footer a:hover { color: #e9b878; }

/* Saf CSS :target panelleri. Ana görünümde yer kaplamazlar. */
.info-panel { display: none; position: fixed; inset: 0; z-index: 20; background: #000b; align-items: center; justify-content: center; padding: 24px; }
.info-panel:target { display: flex; }
.info-panel > div { position: relative; width: min(480px, 100%); max-height: 85vh; overflow: auto; border: 1px solid #d6ab76; border-radius: 8px; background: var(--paper); padding: 35px; color: var(--ink); }
.info-panel h2 { font-size: 28px; margin-bottom: 20px; }
.info-panel p, .info-panel a { font-size: 15px; line-height: 1.55; }
.info-panel .panel-close { position: absolute; top: 5px; right: 16px; font-size: 30px; }
.panel-link { display: block; text-decoration: underline; margin-top: 16px; }
.sitemap { display: flex; flex-direction: column; gap: 8px; }

/* Küçük ekranlarda içerik okunabilir bir tek sütun düzenine geçer. */
@media (max-width: 640px) {
  :root { --u: 1px; }
  body { font-size: 15px; }
  .wrap, .wide { width: auto; margin-inline: 22px; }
  .reference-break { display: none; }
  .eyebrow { font-size: 9px; gap: 10px; }
  .eyebrow::before { flex-basis: 22px; height: 2px; }
  h2 { font-size: 30px; }
  .button { width: 178px; min-height: 44px; font-size: 14px; border-radius: 5px; }
  .hero { height: 580px; }
  .hero-background { background-size: auto 100%; background-position: 59% center; }
  .hero::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, #080c0be8, #080c0b77 70%, #080c0b22); }
  .header { width: auto; margin-inline: 22px; height: 78px; padding-top: 16px; align-items: flex-start; }
  .header .brand { margin: 0; }
  .brand { width: 105px; }
  .brand-mark { flex-basis: 29px; height: 40px; }
  .brand-name { font-size: 32px; }
  .brand-name small { font-size: 8px; }
  .desktop-nav, .header-cta { display: none; }
  .mobile-menu { display: block; margin-left: auto; position: relative; }
  .mobile-menu summary { display: flex; flex-direction: column; gap: 5px; align-items: center; justify-content: center; width: 44px; height: 40px; border: 1px solid #8a643a; border-radius: 4px; background: #101411c9; cursor: pointer; list-style: none; }
  .mobile-menu summary::-webkit-details-marker { display: none; }
  .mobile-menu summary span { width: 19px; height: 2px; background: #eee; }
  .mobile-menu[open] nav { display: flex; }
  .mobile-menu nav { position: absolute; top: 48px; right: 0; display: none; flex-direction: column; min-width: 210px; border: 1px solid #a57c48; background: #101412fa; padding: 8px; border-radius: 5px; }
  .mobile-menu nav a { padding: 12px 16px; font-size: 15px; }
  .breadcrumb { position: relative; top: auto; left: auto; transform: none; font-size: 11px; }
  .hero-copy { position: relative; top: auto; left: auto; transform: none; padding-top: 45px; }
  .hero-copy .eyebrow { margin-bottom: 14px; }
  .hero h1 { font-size: clamp(31px, 8.5vw, 45px); line-height: 1.04; letter-spacing: -.055em; }
  .hero-description { margin-top: 18px; max-width: 300px; font-size: 15px; line-height: 1.45; }
  .hero-copy .button { margin-top: 24px; }
  .concept-caption { font-size: 8px; right: 14px; bottom: 12px; }
  .service-areas { height: auto; padding: 34px 0; }
  .section-heading { display: block; }
  .section-heading h2 { font-size: 31px; line-height: 1.07; margin-top: 12px; }
  .section-heading > p { font-size: 14px; line-height: 1.5; max-width: 350px; margin-top: 16px; }
  .area-grid { grid-template-columns: 1fr; gap: 30px; margin-top: 27px; }
  .area-photo { height: auto; aspect-ratio: 222 / 173; }
  .area-copy { padding: 14px 2px 0; }
  .area-copy h3 { font-size: 22px; }
  .area-copy > p { min-height: 0; margin-top: 10px; font-size: 14px; line-height: 1.5; max-width: 360px; }
  .text-link { margin-top: 14px; font-size: 14px; min-height: 30px; }
  .text-link .icon { font-size: 17px; }
  .services { height: auto; display: block; padding: 8px 0 34px; }
  .services-intro .eyebrow { margin-bottom: 12px; }
  .services-intro h2 { font-size: 31px; white-space: normal; }
  .services-intro > p:last-child { margin-top: 15px; max-width: 340px; font-size: 15px; line-height: 1.45; }
  .service-grid { margin-top: 24px; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: none; gap: 10px; }
  .service-tile { min-height: 155px; display: block; padding: 17px 13px; border-radius: 5px; }
  .service-tile > .icon { font-size: 31px; margin-bottom: 15px; }
  .service-tile h3 { font-size: 13px; line-height: 1.2; letter-spacing: -.04em; }
  .service-tile p { margin-top: 9px; font-size: 12px; line-height: 1.4; letter-spacing: -.03em; }
  .service-tile-copy { width: auto; transform: none; }
  .service-tile h3 br { display: none; }
  .project { display: flex; flex-direction: column; height: auto; }
  .project-copy, .project--stand .project-copy, .project--interior .project-copy, .project--facade .project-copy { padding: 27px 22px 30px; }
  .project-number { font-size: 20px; }
  .project h2 { font-size: 30px; line-height: 1.06; white-space: normal; margin-top: 12px; }
  .project--stand h2 br { display: none; }
  .project-copy > p:not(.project-number) { font-size: 15px; line-height: 1.45; margin-top: 14px; max-width: 450px; }
  .project-tags, .project--interior .project-tags, .project--facade .project-tags { font-size: 11px; gap: 10px; margin-top: 23px; }
  .project-tags li + li::before { margin-right: 10px; }
  .project-photo { height: auto; aspect-ratio: 2.15; object-fit: cover; }
  .project--interior .project-copy { order: -1; }
  .process { height: auto; padding: 32px 0 35px; background-position: 62% center; }
  .process-heading { display: block; }
  .process h2 { font-size: 30px; }
  .process-heading > p { margin-top: 17px; padding: 0; font-size: 14px; line-height: 1.45; max-width: 350px; }
  .process-steps { margin-top: 28px; display: flex; flex-direction: column; text-align: left; gap: 0; }
  .process-steps::before { top: 18px; left: 20px; right: auto; width: 1px; height: calc(100% - 56px); }
  .process-steps li { display: grid; grid-template-columns: 42px 1fr; column-gap: 20px; min-height: 91px; padding-bottom: 18px; }
  .step-number { grid-row: span 2; margin: 0; width: 42px; height: 42px; font-size: 13px; }
  .process-steps h3 { margin: 0; font-size: 17px; padding-top: 1px; align-self: end; }
  .process-steps p { font-size: 13px; line-height: 1.4; margin-top: 6px; }
  .process-steps p br { display: none; }
  .process-steps li:last-child { min-height: 60px; padding-bottom: 0; }
  .contact { height: 350px; }
  .contact-background { background-size: auto 100%; background-position: 55% center; }
  .contact::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, #060a08e8, #060a0877 75%, #060a0833); }
  .contact-copy { padding-top: 30px; }
  .contact .eyebrow { font-size: 8px; letter-spacing: .12em; }
  .contact h2 { font-size: 31px; line-height: 1.06; }
  .contact-copy > p:not(.eyebrow) { font-size: 14px; line-height: 1.4; max-width: 310px; margin-top: 13px; }
  .contact .button { margin-top: 20px; }
  .phone-link { font-size: 11px; gap: 9px; margin-top: 17px; min-height: 24px; }
  .phone-link .icon { font-size: 19px; }
  .footer { height: auto; padding-block: 30px 25px; }
  .footer-main { height: auto; padding: 0; grid-template-columns: 1fr 1fr; gap: 28px 18px; }
  .footer-brand { grid-column: 1 / -1; }
  .footer-brand > .brand { margin-left: 0; }
  .footer-brand > p { font-size: 13px; margin-top: 15px; }
  .social-links { margin-top: 19px; gap: 23px; }
  .social-links a { font-size: 21px; }
  .footer-nav, .footer-contact { font-size: 13px; padding: 0; gap: 5px; line-height: 1.5; }
  .footer-main h3 { font-size: 14px; margin-bottom: 9px; }
  .footer-contact { grid-column: 1 / -1; }
  .footer-contact a, .footer-contact p { font-size: 13px; gap: 12px; min-height: 28px; }
  .footer-contact .icon { font-size: 17px; }
  .footer-motto { display: none; }
  .footer-bottom { margin-top: 30px; padding-top: 23px; display: block; font-size: 10px; }
  .footer-bottom nav { gap: 10px; flex-wrap: wrap; }
  .footer-bottom p { margin-top: 18px; }
  .hero h1, .section-heading h2, .section-heading > p, .area-copy h3, .area-copy > p, .services-intro h2, .services-intro > p:last-child, .project h2, .project-copy > p:not(.project-number), .process h2, .contact h2 { transform: none; }
  .section-heading > p, .area-copy h3, .area-copy > p, .services-intro h2, .services-intro > p:last-child, .project h2, .project-copy > p:not(.project-number), .service-tile h3, .service-tile p { white-space: normal; width: auto; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}
@media print {
  .mobile-menu, .skip-link, .info-panel { display: none !important; }
  .hero, .process, .contact, .footer { print-color-adjust: exact; -webkit-print-color-adjust: exact; }
}

/* Original client photographs and independent sharp architectural concepts. */
.hero-background { background-image: linear-gradient(90deg, #08100bc2, #08100b55 38%, transparent 52%), var(--mfe-bg-56b7e02b524e, url("/api/image?src=%2Fassets%2Fhizmetler%2Fimages%2Fhq%2Fhero.png&w=1920&p=background&d=desktop")); background-size: cover; }
.contact-background { background-image: linear-gradient(90deg, #08110a55, transparent 46%), var(--mfe-bg-575fb3e0d68e, url("/api/image?src=%2Fassets%2Fhizmetler%2Fimages%2Fhq%2Fcontact.png&w=1920&p=background&d=desktop")); background-size: cover; }
.process { background-image: var(--mfe-bg-13ad87be7d1d, url("/api/image?src=%2Fassets%2Fhizmetler%2Fimages%2Fmarble.png&w=1920&p=background&d=desktop")); }