/* Çorlu Seramik, "Derz" görsel sistemi
   Sayfa bir döşeme planı gibi kurulur: modül ızgarası, derz çizgileri, keskin kesim kenarları.
   Tek aile: Archivo. 400 metin, 600 vurgu, 800 dar başlık kesimi. */

@font-face { font-family: "Archivo"; src: url("assets/fonts/archivo-regular.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "Archivo"; src: url("assets/fonts/archivo-semibold.woff2") format("woff2"); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: "Archivo"; src: url("assets/fonts/archivo-display.woff2") format("woff2"); font-weight: 800; font-style: normal; font-display: swap; }
@font-face { font-family: "Archivo Fallback"; src: local("Arial"), local("Helvetica Neue"), local("Roboto"); size-adjust: 98%; ascent-override: 92%; descent-override: 24%; line-gap-override: 0%; }

:root {
  /* malzeme paleti */
  --kirec: #f5f5f3;
  --sva: #e8e9e8;
  --beyaz: #ffffff;
  --derz: #d0d2d2;
  --tas: #929697;
  --tas-koyu: #5b6062;
  --grafit: #1f2223;
  --gece: #111314;
  --gece-2: #191b1c;
  --gece-derz: #333637;
  --gece-metin: #c0c4c5;
  --petrol: #3f4649;
  --petrol-derin: #202426;
  --petrol-acik: #c5cacc;
  --lazer: #f0f1f1;
  --wa: #4d5457;

  --font: "Archivo", "Archivo Fallback", system-ui, -apple-system, "Segoe UI", sans-serif;
  --ease-set: cubic-bezier(.2, .75, .15, 1);
  --ease-trowel: cubic-bezier(.65, 0, .35, 1);

  --wrap: 1360px;
  --gut: 16px;
  --sec: clamp(72px, 8vw, 128px);
  --header-h: 60px;
  --joint: 6px;
}
@media (min-width: 768px) { :root { --gut: 32px; --header-h: 76px; } }
@media (min-width: 1280px) { :root { --gut: 48px; } }

/* ---------- temel ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: calc(var(--header-h) + 12px); }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }
body {
  margin: 0; font-family: var(--font); font-weight: 400;
  font-size: 1.0625rem; line-height: 1.6; color: var(--grafit); background: var(--kirec);
  overflow-x: clip; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
  padding-bottom: calc(64px + env(safe-area-inset-bottom, 0px));
}
@media (min-width: 900px) { body { font-size: 1.125rem; padding-bottom: 0; } }
img { max-width: 100%; height: auto; display: block; }
h1, h2, h3 { margin: 0; color: inherit; text-wrap: balance; }
h1, h2 { font-weight: 800; letter-spacing: -0.012em; }
h3 { font-weight: 600; }
p { margin: 0; text-wrap: pretty; }
a { color: var(--petrol); }
a:hover { color: var(--petrol-derin); }
ul[role="list"], ol[role="list"] { list-style: none; margin: 0; padding: 0; }
figure { margin: 0; }
button { font: inherit; color: inherit; }
dl, dd { margin: 0; }

:focus-visible { outline: 2px solid var(--grafit); outline-offset: 3px; }
.tone-gece :focus-visible, .site-footer :focus-visible, .lightbox :focus-visible, .mobile-menu :focus-visible, .mobile-bar :focus-visible { outline-color: var(--lazer); }

.skip-link { position: absolute; left: 12px; top: -80px; z-index: 200; padding: 12px 16px; background: var(--grafit); color: #fff; text-decoration: none; }
.skip-link:focus { top: 12px; color: #fff; }

.wrap { width: 100%; max-width: calc(var(--wrap) + 2 * var(--gut)); margin-inline: auto; padding-inline: var(--gut); }
.icon { width: 20px; height: 20px; fill: currentColor; flex: none; }
.icon-arrow { fill: none; }

.tone-kirec { background: var(--kirec); }
.tone-sva { background: var(--sva); }
.tone-gece { background: var(--gece); color: #eef1f1; }

/* karo işareti: başlık üstü bilgi ve liste maddelerinde */
.sq { display: inline-block; width: 8px; height: 8px; background: var(--petrol); flex: none; }
.tone-gece .sq { background: var(--petrol-acik); }

.kicker { display: flex; align-items: center; gap: 10px; font-size: .9375rem; font-weight: 600; color: var(--tas-koyu); }

.h-display { font-size: clamp(2.75rem, 1.4rem + 5.4vw, 7rem); line-height: .92; letter-spacing: -0.018em; }
.ln { display: block; overflow: hidden; padding-bottom: .14em; margin-bottom: -.14em; }
.ln > span { display: inline-block; }
.sec-head h2, .intro-copy h2, .note-copy h2, .craft-copy h2, .faq-head h2, .areas-copy h2, .ebat-copy h2, .svc-main-copy h2, .process-intro h2, .contact-copy h2 {
  font-size: clamp(2.125rem, 1.35rem + 2.7vw, 4rem); line-height: .98;
}
.h-sub { font-size: clamp(2.125rem, 1.35rem + 2.7vw, 4rem); line-height: .98; }

/* ---------- butonlar ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 12px;
  min-height: 56px; padding: 14px 22px; border: 1.5px solid transparent; border-radius: 0;
  font-weight: 600; font-size: 1rem; line-height: 1.15; text-decoration: none;
  transition: background-color .18s ease, color .18s ease, border-color .18s ease;
}
.btn-call { background: var(--petrol); color: #fff; }
.btn-call:hover { background: var(--petrol-derin); color: #fff; }
.btn-num { padding-left: 12px; border-left: 1px solid rgba(255, 255, 255, .3); font-variant-numeric: tabular-nums; white-space: nowrap; transition: translate .18s ease; }
.btn-call:hover .btn-num { translate: 2px 0; }
.btn-wa { background: transparent; color: var(--grafit); border-color: var(--grafit); }
.btn-wa .icon-wa { fill: var(--wa); }
.btn-wa:hover { background: var(--grafit); color: #fff; }
.btn-wa:hover .icon-wa { fill: #fff; }
.btn-call .icon-wa { fill: #fff; }
.btn-wa-light { background: transparent; color: #fff; border-color: rgba(238, 241, 241, .7); }
.btn-wa-light .icon-wa { fill: #d6d9da; }
.btn-wa-light:hover { background: #fff; border-color: #fff; color: var(--grafit); }
.btn-wa-light:hover .icon-wa { fill: var(--wa); }

.text-link { display: inline-flex; align-items: center; gap: 8px; color: var(--petrol); font-weight: 600; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 5px; }
.text-link:hover { color: var(--petrol-derin); text-decoration-thickness: 2px; }
.text-link .icon { width: 18px; height: 18px; }
.text-link .icon-arrow { transition: translate .18s ease; }
.text-link:hover .icon-arrow { translate: 4px 0; }

/* ---------- üst menü ---------- */
.site-header { position: sticky; top: 0; z-index: 80; background: var(--kirec); border-bottom: 1px solid transparent; transition: translate .28s var(--ease-set), border-color .2s ease; }
.site-header.is-scrolled { border-bottom-color: var(--derz); }
.site-header.is-hidden { translate: 0 -100%; }
.header-bar { display: flex; align-items: center; gap: 12px; height: var(--header-h); }
.brand { flex: none; margin-right: auto; }
.brand img { height: 34px; width: auto; }
.main-nav { display: none; }
.header-call {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  width: 44px; height: 44px; background: var(--petrol); color: #fff; text-decoration: none; font-weight: 600; font-variant-numeric: tabular-nums;
}
.header-call span { display: none; }
.header-call:hover { background: var(--petrol-derin); color: #fff; }
.menu-toggle { display: inline-flex; align-items: center; gap: 10px; height: 44px; padding: 0 14px; background: transparent; border: 1.5px solid var(--grafit); border-radius: 0; font-weight: 600; cursor: pointer; }
.menu-icon { position: relative; width: 18px; height: 10px; }
.menu-icon i { position: absolute; left: 0; width: 18px; height: 2px; background: currentColor; transition: translate .25s var(--ease-set), rotate .25s var(--ease-set); }
.menu-icon i:first-child { top: 0; }
.menu-icon i:last-child { bottom: 0; }
.menu-toggle[aria-expanded="true"] .menu-icon i:first-child { translate: 0 4px; rotate: 45deg; }
.menu-toggle[aria-expanded="true"] .menu-icon i:last-child { translate: 0 -4px; rotate: -45deg; }
@media (min-width: 768px) {
  .brand img { height: 46px; }
  .header-call { width: auto; padding: 0 18px; height: 48px; }
  .header-call span { display: inline; }
}
@media (min-width: 1100px) {
  .brand img { height: 52px; }
  .main-nav { display: flex; gap: 32px; margin-right: 12px; }
  .main-nav a { position: relative; padding: 8px 0; color: var(--grafit); font-weight: 600; font-size: .9375rem; text-decoration: none; }
  .main-nav a::after { content: ""; position: absolute; left: 50%; bottom: 0; width: 6px; height: 6px; background: var(--petrol); translate: -50% 0; scale: 0; transition: scale .2s var(--ease-set); }
  .main-nav a:hover::after, .main-nav a[aria-current]::after { scale: 1; }
  .menu-toggle, .mobile-menu { display: none !important; }
}

.mobile-menu { position: fixed; inset: 0; z-index: 70; background: var(--gece); color: #fff; padding-top: var(--header-h); overflow-y: auto; }
.menu-open .site-header { background: var(--gece); border-bottom-color: var(--gece-derz); translate: none; }
.menu-open .site-header .brand img { filter: brightness(0) invert(1); }
.menu-open .menu-toggle { color: #fff; border-color: #fff; }
.mm-inner { padding-block: 24px 40px; }
.mobile-menu ul { list-style: none; margin: 0; padding: 0; }
.mm-main a { display: block; padding: 10px 0; border-bottom: 1px solid var(--gece-derz); color: #fff; text-decoration: none; font-weight: 800; font-size: clamp(1.75rem, 7vw, 2.5rem); line-height: 1.15; }
.mm-groups { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-top: 32px; }
.mm-title { margin-bottom: 8px; font-size: .875rem; color: var(--tas); }
.mm-group a { display: block; padding: 6px 0; color: var(--gece-metin); text-decoration: none; font-size: .9375rem; }
.mm-group a[aria-current="page"] { color: var(--lazer); }
.mm-call { width: 100%; margin-top: 32px; }
body.menu-open { overflow: hidden; }

/* ---------- fotoğraf çerçevesi ve filigran ---------- */
.frame { position: relative; display: block; overflow: hidden; background: var(--derz); }
.frame > img:first-child { width: 100%; height: 100%; object-fit: cover; }
.wm { position: absolute; right: 14px; bottom: 12px; z-index: 3; width: 120px; height: auto; opacity: .5; pointer-events: none; filter: drop-shadow(0 1px 1.5px rgba(0, 0, 0, .35)); }
/* filigran, ana logonun en küçük kullanım genişliği olan 120 pikselin altına inmez; dar karelerde gösterilmez */
.frame, .slab, .g-open { container-type: inline-size; }
@container (max-width: 359px) { .wm { display: none; } }
figcaption { margin-top: 12px; font-size: .875rem; line-height: 1.45; color: var(--tas-koyu); }

/* =================================================================
   ÜST ALAN FOTOĞRAFI: tek, net görsel
   Açılışta büyük bir plaka gibi aşağıdan yerine oturur, lazer terazi bir kez geçer.
   ================================================================= */
.slab { position: relative; overflow: hidden; background: var(--derz); aspect-ratio: 4 / 3; }
.slab-img { position: absolute; inset: 0; }
.slab-img > img { width: 100%; height: 100%; object-fit: cover; object-position: var(--pos, 50% 50%); }
.slab .laser, .slab-cover { display: none; }
.slab .wm { right: 20px; bottom: 18px; }

@media (prefers-reduced-motion: no-preference) {
  .slab-cover { position: absolute; inset: 0; z-index: 2; display: grid; grid-template-columns: repeat(var(--cols), 1fr); grid-template-rows: repeat(var(--rows), 1fr); pointer-events: none; }
  .slab-cover i { background: var(--kirec); animation: cover-out .55s var(--ease-set) both; animation-delay: calc(var(--o) * 60ms + 120ms); }
  .slab-img > img { scale: 1.06; animation: slab-settle 1.8s var(--ease-set) .05s both; }
  .slab .laser {
    display: block; position: absolute; z-index: 4; left: 0; right: 0; top: 0; height: 2px;
    background: var(--lazer); box-shadow: 0 0 18px 4px rgba(159, 224, 238, .8); opacity: 0; pointer-events: none;
    animation: laser 1s cubic-bezier(.45, 0, .55, 1) 1.15s both;
  }
}
@supports (animation-timeline: scroll()) {
  @media (prefers-reduced-motion: no-preference) {
    .slab-img > img {
      animation: slab-settle 1.8s var(--ease-set) .05s both, slab-drift linear both;
      animation-timeline: auto, scroll(root);
      animation-range: normal, 0 100vh;
    }
  }
}
@keyframes cover-out { 0% { opacity: 1; scale: 1; } 35% { opacity: 1; scale: .9; } 100% { opacity: 0; scale: .9; } }
@keyframes slab-settle { from { scale: 1.2; } to { scale: 1.06; } }
@keyframes slab-drift { from { translate: 0 0; } to { translate: 0 4.5%; } }
@keyframes laser { 0% { top: 0; opacity: 0; } 8% { opacity: 1; } 92% { opacity: 1; } 100% { top: 100%; opacity: 0; } }

/* ---------- ana sayfa üst alanı ---------- */
.hero { padding-block: 20px 64px; }
.hero-grid { display: grid; grid-template-columns: minmax(0, 1fr); grid-template-areas: "kicker" "title" "media" "lead" "actions" "note"; }
.hero-copy { display: contents; }
.hero .kicker { grid-area: kicker; margin-bottom: 14px; }
.hero h1 { grid-area: title; margin-bottom: 24px; }
.hero h1 .ln > span { white-space: nowrap; }
.hero-media { grid-area: media; margin: 0 calc(var(--gut) * -1) 24px; }
.hero-media figcaption, .ph-media figcaption { padding-inline: var(--gut); }
@media (max-width: 899px) { .hero-media figcaption, .ph-media figcaption { display: none; } }
.hero-lead { grid-area: lead; max-width: 46ch; font-size: 1.125rem; line-height: 1.55; color: var(--tas-koyu); margin-bottom: 24px; }
.hero-actions { grid-area: actions; display: flex; flex-wrap: wrap; gap: 10px; }
.hero-note { grid-area: note; margin-top: 16px; max-width: 46ch; font-size: .9375rem; color: var(--tas-koyu); }
@media (max-width: 479px) { .hero-actions .btn { width: 100%; } }
@media (min-width: 900px) and (max-width: 1150px) { .hero-actions .btn { width: 100%; max-width: 380px; } }
@media (min-width: 900px) {
  .hero { padding-block: 0 112px; }
  .hero-grid { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); grid-template-areas: "copy media"; column-gap: clamp(40px, 5vw, 88px); align-items: center; }
  .hero-copy { display: block; grid-area: copy; padding-block: 48px; }
  .hero h1 { margin-block: 18px 32px; font-size: clamp(3.05rem, 4.5vw, 5.5rem); }
  .hero-media { margin: 0 calc((var(--gut) + max(0px, (100vw - var(--wrap) - 2 * var(--gut)) / 2)) * -1) 0 0; }
  .hero-media .slab { aspect-ratio: auto; height: clamp(520px, calc(100svh - var(--header-h) - 64px), 780px); }
  .hero-media figcaption { padding-inline: 0; }
  .hero-lead { font-size: 1.25rem; margin-bottom: 32px; }
}
@media (prefers-reduced-motion: no-preference) {
  .ln > span { animation: line-up .95s var(--ease-set) .15s both; }
  .ln + .ln > span { animation-delay: .25s; }
  .hero .kicker, .hero-lead, .hero-actions, .hero-note, .ph-copy .kicker, .crumbs, .hero-media figcaption, .ph-media figcaption, .ph-copy .hero-lead, .ph-copy .hero-actions, .ph-copy .hero-note { animation: fade-up .7s var(--ease-set) both; }
  .hero-lead, .ph-copy .hero-lead { animation-delay: .4s; }
  .hero-actions, .ph-copy .hero-actions { animation-delay: .52s; }
  .hero-note, .ph-copy .hero-note, .hero-media figcaption, .ph-media figcaption { animation-delay: .65s; }
}
@keyframes line-up { from { translate: 0 108%; } }
@keyframes fade-up { from { opacity: 0; translate: 0 16px; } }

/* ---------- güven karoları ---------- */
.trust { padding-bottom: 0; }
.trust + .services { padding-top: clamp(72px, 8vw, 112px); }
.facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; background: var(--derz); border: 1px solid var(--derz); }
.facts > div { background: var(--kirec); padding: 22px 18px 24px; }
.facts dt { font-weight: 800; font-size: clamp(2.25rem, 1.5rem + 2.8vw, 4rem); line-height: 1; font-variant-numeric: tabular-nums; }
.facts dd { margin-top: 8px; font-size: .9375rem; line-height: 1.35; color: var(--grafit); }
@media (min-width: 768px) { .facts { grid-template-columns: repeat(4, minmax(0, 1fr)); } .facts > div { padding: 28px 28px 30px; } }
.facts-sm dt { font-size: clamp(1.5rem, 1.2rem + 1.2vw, 2.25rem); }
.trust-sub { padding-bottom: clamp(40px, 5vw, 72px); }

/* ---------- bölüm başlıkları ---------- */
.sec { padding-block: var(--sec); }
.sec-head { display: grid; gap: 18px; max-width: 820px; margin-bottom: clamp(36px, 5vw, 72px); }
.sec-head p { max-width: 58ch; color: var(--tas-koyu); font-size: 1.0625rem; }
@media (min-width: 1100px) {
  .works .sec-head, .price .sec-head, .hub .sec-head, .details .sec-head, .steps-sec .sec-head { max-width: none; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 64px; align-items: end; }
}

/* ---------- hizmetler ---------- */
.svc-main { display: grid; gap: 36px; margin-bottom: clamp(72px, 9vw, 136px); }
.svc-lead { margin-top: 20px; max-width: 48ch; font-size: 1.1875rem; line-height: 1.55; color: var(--tas-koyu); }
.spec { margin-top: 32px; border-top: 1px solid var(--derz); }
.spec > div { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--derz); }
.spec dt { font-weight: 600; }
.spec dd { color: var(--tas-koyu); }
.svc-links { display: flex; flex-wrap: wrap; gap: 12px 32px; margin-top: 28px; }
.svc-main-photo .frame { aspect-ratio: 1448 / 1086; }
.svc-main-photo .frame > img:first-child { object-position: 50% 40%; }
@media (min-width: 900px) {
  .svc-main { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(40px, 6vw, 112px); align-items: center; }
}
.svc-list-head { display: grid; gap: 12px; margin-bottom: 24px; }
.svc-list-head p { color: var(--tas-koyu); max-width: 52ch; }
@media (min-width: 900px) {
  .svc-list-head { grid-template-columns: minmax(0, 7fr) minmax(0, 4fr) 28px; align-items: end; gap: 32px; }
  .svc-list-head h2 { grid-column: 1; }
  .svc-list-head p { grid-column: 2; justify-self: start; }
}
.svc-list { border-top: 1.5px solid var(--grafit); }
.svc-list li { position: relative; border-bottom: 1px solid var(--derz); }
.svc-list a, .sv-static { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) 28px; align-items: center; gap: 16px; padding: 22px 0; color: var(--grafit); text-decoration: none; isolation: isolate; }
.svc-list h3 { display: grid; gap: 6px; font-weight: 400; }
.sv-t { font-weight: 800; font-size: clamp(1.625rem, 1.15rem + 2vw, 3rem); line-height: 1; letter-spacing: -0.01em; transition: translate .35s var(--ease-set), color .2s ease; }
.sv-d { font-size: 1rem; color: var(--tas-koyu); max-width: 46ch; }
.sv-pad { width: 28px; }
.svc-list .icon-arrow { width: 28px; height: 28px; transition: translate .35s var(--ease-set); }
.svc-list a::before { content: ""; position: absolute; inset: 0 calc(var(--gut) * -1); z-index: -1; background: var(--sva); scale: 0 1; transform-origin: left; transition: scale .42s var(--ease-trowel); }
.svc-list a:hover::before { scale: 1 1; }
.svc-list a:hover .sv-t { translate: 12px 0; color: var(--petrol); }
.svc-list a:hover .icon-arrow { translate: -6px 0; color: var(--petrol); }
@media (min-width: 900px) {
  .svc-list a, .sv-static { grid-template-columns: minmax(0, 7fr) minmax(0, 4fr) 28px; gap: 32px; padding: 28px 0; }
  .svc-list h3 { display: contents; }
  .sv-t { grid-column: 1; }
  .sv-d { grid-column: 2; }
  .svc-list .icon-arrow, .sv-pad { grid-column: 3; }
}
.cursor-preview { position: fixed; left: 0; top: 0; z-index: 60; width: 240px; height: 300px; pointer-events: none; opacity: 0; scale: .92; transition: opacity .25s ease, scale .35s var(--ease-set); border: 6px solid var(--kirec); box-shadow: 0 0 0 1px var(--derz); }
.cursor-preview img { width: 100%; height: 100%; object-fit: cover; }
.cursor-preview.is-on { opacity: 1; scale: 1; }
@media (hover: none), (max-width: 899px) { .cursor-preview { display: none; } }

/* ---------- galeri ---------- */
.plan { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1px; padding: 1px; background: var(--derz); }
.plan .g-item { min-width: 0; margin: 0; background: var(--beyaz); }
.g-open { position: relative; display: block; width: 100%; aspect-ratio: 4 / 5; padding: 0; border: 0; overflow: hidden; background: var(--sva); cursor: zoom-in; }
.g-open > img:first-child { width: 100%; height: 100%; object-fit: cover; transition: scale .6s var(--ease-set); }
.g-open:hover > img:first-child { scale: 1.035; }
.g-cap { display: grid; gap: 2px; padding: 10px 12px 12px; font-size: .8125rem; line-height: 1.35; color: var(--tas-koyu); }
.g-cap h3 { font-weight: 600; color: var(--grafit); font-size: .875rem; }
.g-cap span { display: block; }
@media (min-width: 768px) {
  .plan { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .g-cap { padding: 14px 16px 16px; }
}
@media (min-width: 1100px) { .plan { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.works-more { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 24px; margin-top: 40px; color: var(--tas-koyu); }

/* ---------- öncesi ve sonrası ---------- */
.ba-grid { display: grid; gap: 24px; }
.ba-card { min-width: 0; }
.ba-photos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
.ba-shot { position: relative; display: block; width: 100%; aspect-ratio: 3 / 4; padding: 0; border: 0; overflow: hidden; background: var(--sva); cursor: zoom-in; }
.ba-shot > img:not(.wm) { width: 100%; height: 100%; object-fit: cover; transition: scale .6s var(--ease-set); }
.ba-shot:hover > img:not(.wm) { scale: 1.025; }
.ba-label { position: absolute; z-index: 3; top: 12px; left: 12px; padding: 7px 10px; background: rgba(255, 255, 255, .94); color: var(--grafit); font-size: .75rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.ba-card h3 { margin-top: 16px; font-size: clamp(1.25rem, 1.05rem + .5vw, 1.625rem); }
.ba-shot .wm { width: 74px; }
@media (min-width: 900px) { .ba-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(28px, 4vw, 56px); } }

/* ---------- süreç: gerçek iş fotoğrafı ve dört adım ---------- */
.process { overflow: clip; padding-block: var(--sec); }
.process-intro { display: grid; gap: 22px; margin-bottom: clamp(36px, 5vw, 68px); }
.process-intro > div { display: grid; gap: 15px; }
.process-intro .kicker { color: var(--petrol-acik); }
.process-intro h2 { max-width: 14ch; font-size: clamp(2.125rem, 1.45rem + 2.35vw, 3.625rem); }
.process-intro > p { max-width: 54ch; color: #c8d0d2; font-size: 1rem; line-height: 1.7; }
.process-grid { display: grid; gap: 38px; }
.process-photo .frame { aspect-ratio: 4 / 5; border: 1px solid var(--gece-derz); background: var(--gece-2); }
.process-photo .frame > img:first-child { object-position: 50% 54%; }
.process-photo figcaption { max-width: 50ch; color: #909ca0; }
.process-flow { display: grid; align-content: start; }
.process-steps { list-style: none; margin: 0; padding: 0; border-top: 1px solid #3a4549; }
.process-step { display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: 20px; padding: 23px 0; border-bottom: 1px solid #3a4549; }
.process-n { padding-top: 3px; color: var(--petrol-acik); font-size: .875rem; font-weight: 600; letter-spacing: .09em; font-variant-numeric: tabular-nums; }
.process-step h3 { margin-bottom: 7px; font-size: clamp(1.25rem, 1.05rem + .55vw, 1.625rem); line-height: 1.15; }
.process-step p { max-width: 54ch; color: #b5bfc1; font-size: .9375rem; line-height: 1.55; }
.process-links { margin-top: 28px; max-width: 54ch; color: #a9b4b7; font-size: .9375rem; line-height: 1.65; }
.process a { color: #fff; text-decoration-color: var(--petrol-acik); text-underline-offset: 4px; }
.process a:hover { color: var(--lazer); }
@media (min-width: 900px) {
  .process-intro { grid-template-columns: minmax(0, 5fr) minmax(360px, 7fr); gap: clamp(56px, 8vw, 128px); align-items: end; }
  .process-intro > p { justify-self: end; }
  .process-grid { grid-template-columns: minmax(0, 5fr) minmax(420px, 7fr); gap: clamp(56px, 8vw, 128px); align-items: start; }
  .process-photo .frame { aspect-ratio: 5 / 6; }
  .process-step { grid-template-columns: 68px minmax(0, 1fr); gap: 24px; padding-block: clamp(24px, 2.3vw, 34px); }
}
@media (max-width: 899px) {
  .process { padding-block: 76px; }
  .process-intro h2 { max-width: 12ch; }
  .process-grid { gap: 34px; }
  .process-photo .frame { aspect-ratio: 5 / 6; }
  .process-step { grid-template-columns: 44px minmax(0, 1fr); gap: 16px; padding-block: 20px; }
}

/* ---------- işçilik: işaretli fotoğraf ---------- */
.craft-grid { display: grid; gap: 40px; }
.ann-photo { max-width: 480px; }
.ann-photo .frame { --cut: 32.9; --vis: .671; aspect-ratio: 3 / 4; }
.ann-photo .frame > img:first-child { object-position: 50% 100%; }
.ann-dot {
  position: absolute; z-index: 2; left: calc(var(--x) * 1%); top: calc((var(--y) - var(--cut)) / var(--vis) * 1%);
  translate: -50% -50%; display: grid; place-items: center; width: 34px; height: 34px;
  background: var(--petrol); color: #fff; font-size: .9375rem; font-weight: 800; line-height: 1;
  box-shadow: 0 0 0 4px rgba(255, 255, 255, .85); transition: scale .18s ease, background-color .18s ease;
}
.craft:has(.ann-list li[data-n="1"]:hover) .ann-dot[data-n="1"],
.craft:has(.ann-list li[data-n="2"]:hover) .ann-dot[data-n="2"],
.craft:has(.ann-list li[data-n="3"]:hover) .ann-dot[data-n="3"] { scale: 1.25; background: var(--grafit); }
.craft-lead { margin-top: 20px; max-width: 52ch; font-size: 1.1875rem; line-height: 1.55; color: var(--tas-koyu); }
.ann-list { list-style: none; margin: 32px 0 0; padding: 0; border-top: 1px solid var(--derz); }
.ann-list li { display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 18px; padding: 20px 0; border-bottom: 1px solid var(--derz); }
.ann-num { display: grid; place-items: center; width: 34px; height: 34px; background: var(--petrol); color: #fff; font-weight: 800; }
.ann-list h3 { margin: 4px 0 6px; font-size: 1.1875rem; }
.ann-list p { color: var(--tas-koyu); font-size: 1rem; }
@media (min-width: 900px) {
  .craft-grid { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(48px, 7vw, 120px); align-items: center; }
  .ann-photo .frame { --cut: 18.9; --vis: .811; aspect-ratio: 31 / 50; }
}

/* ---------- ebat fotoğraf seçimi ---------- */
.ebat-grid { display: grid; gap: clamp(40px, 6vw, 88px); }
.ebat-copy p { margin-top: 20px; max-width: 52ch; color: var(--tas-koyu); }
.ebat-copy .ebat-note { font-size: .875rem; }
.size-showcase { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 0; padding: 0; list-style: none; }
.size-card { min-width: 0; }
.size-card-button { position: relative; display: block; width: 100%; aspect-ratio: 4 / 5; padding: 0; border: 0; overflow: hidden; background: var(--sva); color: #fff; cursor: zoom-in; text-align: left; }
.size-card-button::after { position: absolute; inset: 48% 0 0; z-index: 1; background: linear-gradient(transparent, rgba(10, 11, 12, .88)); content: ""; pointer-events: none; }
.size-card-button > img:first-child { width: 100%; height: 100%; object-fit: cover; transition: scale .65s var(--ease-set), filter .3s ease; }
.size-card-button:hover > img:first-child { scale: 1.035; }
.size-card-meta { position: absolute; left: 16px; right: 16px; bottom: 14px; z-index: 2; display: grid; gap: 2px; }
.size-card-meta strong { font-size: clamp(1.2rem, 1rem + .7vw, 1.75rem); line-height: 1; }
.size-card-meta small { color: rgba(255, 255, 255, .72); font-size: .75rem; }
.size-card-button .wm { top: 12px; right: 12px; bottom: auto; width: 70px; opacity: .42; }
@media (min-width: 900px) { .ebat-grid { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(48px, 7vw, 120px); align-items: center; } }

/* ---------- fiyatı belirleyenler ---------- */
.factors { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1px; background: var(--derz); border: 1px solid var(--derz); }
.factors li { background: var(--beyaz); padding: 26px 22px 28px; }
.factors h3 { font-size: 1.25rem; margin-bottom: 8px; }
.factors p { color: var(--tas-koyu); font-size: 1rem; }
@media (min-width: 640px) { .factors { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .factors { grid-template-columns: repeat(3, minmax(0, 1fr)); } .factors li { padding: 32px 30px 36px; } }
.price-cta { display: grid; justify-items: start; gap: 18px; margin-top: 40px; }
.price-cta p { max-width: 60ch; color: var(--tas-koyu); }
.price-cta strong { color: var(--grafit); font-weight: 600; }

/* ---------- bölge sayfaları bağlantıları ---------- */
.hub-grid { display: grid; gap: 48px; }
.hub-city { font-weight: 800; font-size: clamp(1.75rem, 1.4rem + 1.2vw, 2.5rem); line-height: 1; padding-bottom: 16px; border-bottom: 1.5px solid var(--grafit); }
.hub-col a, .hub-rows a { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "t i" "d i"; column-gap: 16px; row-gap: 2px; align-items: center; padding: 18px 0; border-bottom: 1px solid var(--derz); color: var(--grafit); text-decoration: none; }
.hub-t { grid-area: t; font-weight: 600; font-size: 1.125rem; transition: translate .3s var(--ease-set), color .2s ease; }
.hub-d { grid-area: d; font-size: .9375rem; color: var(--tas-koyu); }
.hub-col .icon-arrow, .hub-rows .icon-arrow { grid-area: i; transition: translate .3s var(--ease-set), color .2s ease; }
.hub-col a:hover .hub-t, .hub-rows a:hover .hub-t { color: var(--petrol); translate: 8px 0; }
.hub-col a:hover .icon-arrow, .hub-rows a:hover .icon-arrow { color: var(--petrol); translate: 6px 0; }
.hub-rows { border-top: 1.5px solid var(--grafit); }
@media (min-width: 800px) { .hub-grid { grid-template-columns: 1fr 1fr; gap: clamp(40px, 6vw, 96px); } }

/* ---------- hizmet bölgeleri ---------- */
.areas-grid { display: grid; gap: 40px; }
.areas-copy p { margin-top: 18px; max-width: 52ch; color: var(--tas-koyu); }
.areas-copy .text-link { margin-top: 24px; }
.areas-other { font-size: .9375rem; }
.area-tiles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; background: var(--derz); border: 1px solid var(--derz); align-self: start; }
.ar { display: grid; align-content: space-between; gap: 18px; min-height: 96px; padding: 18px; background: var(--beyaz); }
.ar > a { display: grid; align-content: space-between; gap: 18px; min-height: 100%; color: inherit; text-decoration: none; }
.ar > a:hover .ar-n { color: var(--petrol); }
.ar-n { font-weight: 800; font-size: clamp(1.25rem, 1rem + .9vw, 1.75rem); line-height: 1.05; overflow-wrap: normal; word-break: normal; hyphens: none; }
.ar-d { font-size: .875rem; color: var(--tas-koyu); line-height: 1.35; }
.area-tiles .ar.is-base { background: var(--petrol); color: #fff; }
.ar.is-base .ar-d { color: #d6e7ec; }
@media (min-width: 640px) { .area-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); } .ar { min-height: 120px; padding: 22px; } }
@media (min-width: 960px) { .areas-grid { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(48px, 6vw, 112px); } }

/* ---------- sık sorulanlar ---------- */
.faq-grid { display: grid; gap: 36px; }
.faq-head p { margin: 18px 0 22px; max-width: 42ch; color: var(--tas-koyu); }
.faq-list { border-top: 1.5px solid var(--grafit); }
.faq-list details { border-bottom: 1px solid var(--derz); }
.faq-list summary { display: grid; grid-template-columns: minmax(0, 1fr) 28px; gap: 20px; align-items: center; padding: 22px 0; list-style: none; cursor: pointer; font-weight: 600; font-size: 1.125rem; line-height: 1.35; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary:hover span { color: var(--petrol); }
.plus { position: relative; width: 28px; height: 28px; }
.plus::before, .plus::after { content: ""; position: absolute; left: 50%; top: 50%; width: 16px; height: 2px; background: var(--grafit); translate: -50% -50%; transition: rotate .3s var(--ease-set); }
.plus::after { rotate: 90deg; }
.faq-list details[open] .plus::before { rotate: 45deg; }
.faq-list details[open] .plus::after { rotate: 135deg; }
.faq-a p { padding: 0 48px 24px 0; max-width: 64ch; color: var(--tas-koyu); }
@media (min-width: 960px) {
  .faq-grid { grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: clamp(48px, 6vw, 112px); align-items: start; }
  .faq-head { position: sticky; top: calc(var(--header-h) + 32px); }
}

/* ---------- iletişim ---------- */
.contact { padding-block: clamp(80px, 10vw, 144px); }
.contact-grid { display: grid; gap: 44px; }
.contact-copy p { margin-top: 20px; max-width: 46ch; color: var(--gece-metin); font-size: 1.125rem; }
.contact-meta { list-style: none; margin: 32px 0 0; padding: 0; display: grid; gap: 10px; color: var(--gece-metin); }
.contact-meta li { display: flex; align-items: center; gap: 12px; }
.contact-copy p + .contact-meta { margin-top: 32px; }
.contact-actions { display: grid; gap: 22px; align-content: start; }
.phone-tiles { display: grid; gap: 12px; color: #fff; text-decoration: none; }
.phone-tiles:hover { color: #fff; }
.pt-label { display: inline-flex; align-items: center; gap: 10px; font-weight: 600; color: var(--gece-metin); }
.pt-row { display: flex; flex-wrap: nowrap; gap: 3px; perspective: 600px; }
.dg { display: grid; place-items: center; flex: 1 1 0; min-width: 0; aspect-ratio: 3 / 4; max-width: 72px; border: 1px solid var(--gece-derz); background: var(--gece-2); font-weight: 800; font-size: clamp(1.375rem, .9rem + 2.6vw, 3.25rem); line-height: 1; font-variant-numeric: tabular-nums; transition: background-color .25s ease, border-color .25s ease; }
.dg.gap { flex: 0 0 8px; border: 0; background: none; }
.phone-tiles:hover .dg:not(.gap) { background: var(--petrol); border-color: var(--petrol); }
.contact-actions .btn { width: 100%; }
.contact-hint { max-width: 48ch; margin-top: 2px; color: var(--tas); font-size: .875rem; line-height: 1.6; }
@media (min-width: 960px) { .contact-grid { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(48px, 6vw, 112px); align-items: center; } }

/* ---------- alt bilgi ---------- */
.site-footer { background: var(--gece); color: var(--tas); padding: 64px 0 28px; font-size: .9375rem; border-top: 1px solid var(--gece-derz); }
.foot-grid { display: grid; gap: 36px; }
.foot-brand img { height: 78px; width: auto; }
.foot-brand p { margin-top: 18px; max-width: 30ch; }
.foot-title { margin-bottom: 12px; color: #fff; font-weight: 600; }
.foot-col ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.site-footer a { color: var(--gece-metin); text-decoration: none; }
.site-footer a:hover { color: #fff; text-decoration: underline; text-underline-offset: 4px; }
.foot-address { max-width: 25ch; line-height: 1.45; }
.foot-bottom { position: relative; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 24px; margin-top: 48px; padding-top: 22px; font-size: .875rem; }
.foot-bottom::before { content: ""; position: absolute; top: 0; left: var(--gut); right: var(--gut); height: 1px; background: var(--gece-derz); }
@media (min-width: 640px) { .foot-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1024px) { .foot-grid { grid-template-columns: 1.35fr repeat(4, minmax(0, 1fr)); gap: 28px; } }

/* ---------- mobil çağrı şeridi ---------- */
.mobile-bar {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 75;
  display: grid; grid-template-columns: 1fr 1fr; gap: 2px; background: var(--gece-derz);
  padding-bottom: env(safe-area-inset-bottom, 0px);
  transition: translate .3s var(--ease-set);
}
.mobile-bar a { display: flex; align-items: center; justify-content: center; gap: 10px; min-height: 62px; font-weight: 600; font-size: 1.0625rem; text-decoration: none; color: #fff; }
.mb-call { background: var(--petrol); }
.mb-wa { background: var(--gece); }
.mb-wa .icon-wa { fill: #d6d9da; }
.mobile-bar a:hover { color: #fff; filter: brightness(1.1); }
.js .mobile-bar:not(.is-shown) { translate: 0 110%; }
@media (min-width: 900px) { .mobile-bar { display: none; } }

/* ---------- ışık kutusu ---------- */
.lightbox { width: 100vw; height: 100dvh; max-width: none; max-height: none; margin: 0; padding: 0; border: 0; background: var(--gece); color: #fff; overflow: hidden; }
.lightbox::backdrop { background: rgba(19, 24, 25, .7); }
.lb-fig { position: absolute; inset: 64px 12px 24px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; }
.lb-frame { position: relative; display: block; max-width: 100%; }
.lb-frame > img:first-child { display: block; max-width: 100%; max-height: calc(100dvh - 160px); width: auto; height: auto; touch-action: pinch-zoom; }
.lb-bar { display: flex; justify-content: space-between; gap: 16px; width: 100%; max-width: 1100px; margin: 0; color: var(--gece-metin); font-size: .9375rem; }
.lb-count { font-variant-numeric: tabular-nums; white-space: nowrap; color: var(--tas); }
.lb-btn { position: absolute; display: grid; place-items: center; width: 52px; height: 52px; padding: 0; border: 1px solid var(--gece-derz); border-radius: 0; background: var(--gece-2); color: #fff; cursor: pointer; }
.lb-btn:hover { background: var(--petrol); border-color: var(--petrol); }
.lb-btn svg { width: 22px; height: 22px; }
.lb-close { top: 8px; right: 12px; }
.lb-prev, .lb-next { top: 50%; translate: 0 -50%; z-index: 2; display: none; }
.lb-prev { left: 16px; }
.lb-next { right: 16px; }
@media (min-width: 900px) { .lb-prev, .lb-next { display: grid; } .lb-fig { inset: 72px 96px 32px; } }
.lightbox[data-single] .lb-prev, .lightbox[data-single] .lb-next, .lightbox[data-single] .lb-count { display: none; }
html:has(dialog[open]) { overflow: hidden; }
::view-transition-group(lb) { animation-duration: .42s; animation-timing-function: var(--ease-set); }

/* =================================================================
   ALT SAYFALAR
   ================================================================= */
.page-hero { padding-block: 16px 56px; }
.ph-grid { display: grid; grid-template-columns: minmax(0, 1fr); grid-template-areas: "crumbs" "kicker" "title" "media" "lead" "actions" "note"; }
.ph-copy { display: contents; }
.crumbs { grid-area: crumbs; }
.crumbs ol { list-style: none; display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 20px; padding: 0; font-size: .875rem; color: var(--tas-koyu); }
.crumbs li + li::before { content: "/"; margin-right: 8px; color: var(--tas); }
.crumbs a { color: var(--grafit); text-underline-offset: 3px; }
.ph-copy .kicker { grid-area: kicker; margin-bottom: 14px; }
.ph-copy h1 { grid-area: title; margin-bottom: 24px; font-size: clamp(2.625rem, 1.5rem + 4.2vw, 5.75rem); }
.ph-media { grid-area: media; margin: 0 calc(var(--gut) * -1) 24px; }
.ph-copy .hero-lead { grid-area: lead; }
.ph-copy .hero-actions { grid-area: actions; }
.ph-copy .hero-note { grid-area: note; }
.ph-fayans .slab { aspect-ratio: 3 / 2; }
@media (min-width: 900px) {
  .page-hero { padding-block: 0 96px; }
  .ph-grid { column-gap: clamp(40px, 5vw, 96px); align-items: center; grid-template-areas: "copy media"; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); }
  .ph-copy { display: block; grid-area: copy; padding-block: 40px; }
  .ph-media figcaption { padding-inline: 0; }
  .ph-copy h1 { margin-block: 16px 28px; }
  .ph-copy .hero-lead { font-size: 1.1875rem; margin-bottom: 30px; }
  .ph-usta .ph-media, .ph-banyo .ph-media { margin: 0 calc((var(--gut) + max(0px, (100vw - var(--wrap) - 2 * var(--gut)) / 2)) * -1) 0 0; }
  .ph-tadilat .ph-media { margin: 0 0 0 calc((var(--gut) + max(0px, (100vw - var(--wrap) - 2 * var(--gut)) / 2)) * -1); }
  .ph-usta .slab, .ph-banyo .slab, .ph-tadilat .slab { aspect-ratio: auto; height: clamp(520px, calc(100svh - var(--header-h) - 64px), 820px); }
  .ph-banyo .ph-grid { grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); }
  .ph-tadilat .ph-grid { grid-template-areas: "media copy"; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); }
  .ph-tadilat .ph-media figcaption { padding-left: calc(var(--gut) + max(0px, (100vw - var(--wrap) - 2 * var(--gut)) / 2)); }
  .ph-fayans .page-hero, .page-hero.ph-fayans { padding-top: 24px; }
  .ph-fayans .ph-grid { grid-template-areas: "copy" "media"; grid-template-columns: minmax(0, 1fr); }
  .ph-fayans .ph-copy { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); grid-template-areas: "crumbs crumbs" "kicker lead" "title actions" "title note"; column-gap: clamp(40px, 5vw, 96px); align-items: start; padding-block: 16px 0; }
  .ph-fayans .ph-copy .kicker { align-self: end; margin-bottom: 18px; }
  .ph-fayans .ph-copy h1 { margin-bottom: 0; }
  .ph-fayans .ph-copy .hero-lead { margin-bottom: 20px; align-self: end; }
  .ph-fayans .ph-media { margin: 48px calc((var(--gut) + max(0px, (100vw - var(--wrap) - 2 * var(--gut)) / 2)) * -1) 0; }
  .ph-fayans .ph-media figcaption { padding-inline: calc(var(--gut) + max(0px, (100vw - var(--wrap) - 2 * var(--gut)) / 2)); }
  .ph-fayans .slab { aspect-ratio: 21 / 8; }
}

.toc { border-block: 1px solid var(--derz); background: var(--kirec); }
.toc-row { display: flex; align-items: center; gap: 24px; }
.toc-inner { display: flex; flex: 1 1 auto; min-width: 0; overflow-x: auto; scrollbar-width: none; -webkit-mask-image: linear-gradient(90deg, #000 85%, transparent); mask-image: linear-gradient(90deg, #000 85%, transparent); }
.toc a.is-active { color: var(--petrol); box-shadow: inset 0 -2px var(--petrol); }
.toc-call { display: none; align-items: center; gap: 8px; flex: none; color: var(--petrol); font-weight: 600; text-decoration: none; font-variant-numeric: tabular-nums; }
.toc-call .icon { width: 18px; height: 18px; }
@media (min-width: 900px) { .toc-inner { -webkit-mask-image: none; mask-image: none; } .toc-call { display: inline-flex; } }
.toc-inner::-webkit-scrollbar { display: none; }
.toc-inner a { flex: none; padding: 16px 20px; color: var(--grafit); font-weight: 600; font-size: .9375rem; text-decoration: none; border-right: 1px solid var(--derz); }
.toc-inner a:first-child { padding-left: 0; }
.toc-inner a:hover { color: var(--petrol); }

.intro-grid { display: grid; gap: 44px; }
.intro-first { margin-top: 24px; max-width: 56ch; font-size: 1.25rem; line-height: 1.55; }
.intro-rest { display: grid; gap: 0 40px; }
.intro-rest p { margin-top: 18px; color: var(--tas-koyu); font-size: 1rem; }
.scope { align-self: start; }
.scope h3 { font-size: 1.25rem; margin-bottom: 14px; }
.scope-hint { margin: -6px 0 14px; font-size: .875rem; color: var(--tas-koyu); }
.ticks, .scope-seq ol { list-style: none; margin: 0; padding: 0; border-top: 1.5px solid var(--grafit); }
.ticks li, .scope-seq li { display: flex; align-items: center; gap: 14px; padding: 13px 0; border-bottom: 1px solid var(--derz); }
.sc-n { display: grid; place-items: center; width: 28px; height: 28px; flex: none; background: var(--petrol); color: #fff; font-weight: 800; font-size: .875rem; }
@media (min-width: 700px) { .intro-rest { grid-template-columns: 1fr 1fr; } }
@media (min-width: 960px) {
  .intro-grid { grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: clamp(48px, 7vw, 120px); }
  .scope { position: sticky; top: calc(var(--header-h) + 32px); padding-top: 12px; }
  .intro-fayans .intro-grid { grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); }
  .intro-fayans .scope { order: -1; }
  .intro-tadilat .intro-rest { grid-template-columns: 1fr; max-width: 62ch; }
}

.detail-list { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1px; background: var(--derz); border: 1px solid var(--derz); }
.detail-list li { position: relative; padding: 28px 24px 32px; background: var(--beyaz); }
.detail-list h3 { display: flex; align-items: center; gap: 12px; font-size: 1.3125rem; margin-bottom: 10px; }
.detail-list p { color: var(--tas-koyu); font-size: 1rem; }
@media (min-width: 800px) {
  .detail-list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .detail-list li { padding: 36px 32px 40px; }
  .details-tadilat .detail-list { grid-template-columns: minmax(0, 1fr); }
  .details-tadilat .detail-list li { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: 28px; align-items: start; }
}

.note-grid { display: grid; gap: 36px; }
.note-port .note-photo .frame { aspect-ratio: 4 / 5; }
.note-land .note-photo .frame { aspect-ratio: 4 / 3; }
.note-copy .kicker { margin-bottom: 16px; }
.note-copy p:not(.kicker) { margin: 20px 0 24px; max-width: 52ch; color: var(--tas-koyu); font-size: 1.125rem; }
@media (min-width: 900px) {
  .note-port .note-grid { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(48px, 7vw, 120px); align-items: center; }
  .note-port .note-photo .frame { aspect-ratio: 3 / 4; }
  .note-land .note-grid { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(40px, 5vw, 96px); align-items: center; }
}

.lay-steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: minmax(0, 1fr); gap: 1px; background: var(--derz); border: 1px solid var(--derz); }
.lay-steps li { padding: 26px 22px 30px; background: var(--beyaz); }
.st-n { display: block; font-weight: 800; font-size: clamp(2.5rem, 1.8rem + 2.4vw, 4rem); line-height: 1; color: var(--petrol); margin-bottom: 18px; font-variant-numeric: tabular-nums; }
.lay-steps h3 { font-size: 1.25rem; margin-bottom: 8px; }
.lay-steps p { color: var(--tas-koyu); font-size: 1rem; }
@media (min-width: 640px) { .lay-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .lay-steps { grid-template-columns: repeat(4, minmax(0, 1fr)); } .lay-steps li { padding: 32px 28px 38px; } }

.related-grid { display: grid; gap: 28px; }
.related .sec-head { margin-bottom: 0; }
@media (min-width: 960px) { .related-grid { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(48px, 6vw, 112px); align-items: start; } }

/* =================================================================
   KAYDIRMA İLE DÖŞENEN ÖĞELER (script.js sınıfları ekler)
   Gözlemci, kırpılmış öğenin kendisini değil kapsayıcısını izler.
   ================================================================= */
@media (prefers-reduced-motion: no-preference) {
  .js [data-rv] { transition: opacity .8s var(--ease-set), translate .9s var(--ease-set); }
  .js [data-rv]:not(.is-in) { opacity: 0; translate: 0 36px; }

  .js [data-rv-rows] > * { transition: clip-path .95s var(--ease-trowel), opacity .6s ease, translate .9s var(--ease-set); transition-delay: calc(var(--d, 0) * 70ms); clip-path: inset(-8px); }
  .js [data-rv-rows]:not(.is-in) > * { clip-path: inset(-8px 100% -8px -8px); opacity: 0; translate: -18px 0; }

  .js [data-rv-grid] > * { transition: opacity .55s ease, translate .7s var(--ease-set), rotate .7s var(--ease-set); transition-delay: calc(var(--d, 0) * 80ms); }
  .js [data-rv-grid]:not(.is-in) > * { opacity: 0; translate: 0 -22px; rotate: .8deg; }

  .js [data-rv-img] { clip-path: inset(-6px); transition: clip-path 1.1s var(--ease-trowel); }
  .js [data-rv-img] > img:first-child { transition: scale 1.6s var(--ease-set); }
  .js [data-rv-img]:not(.is-in) { clip-path: inset(100% -6px -6px -6px); }
  .js [data-rv-img]:not(.is-in) > img:first-child { scale: 1.16; }

  .js [data-plan] .g-item { transition: opacity .6s ease, translate .75s var(--ease-set), rotate .75s var(--ease-set); transition-delay: calc(var(--i) * 85ms); }
  .js [data-plan]:not(.is-in) .g-item { opacity: 0; translate: 0 -28px; rotate: .7deg; }

  .js [data-rv-sizes] .sz rect { transform-box: fill-box; transform-origin: 50% 100%; transition: scale .9s var(--ease-set); transition-delay: calc(var(--i) * 160ms + 100ms); }
  .js [data-rv-sizes] .sz text { transition: opacity .5s ease; transition-delay: calc(var(--i) * 160ms + 500ms); }
  .js [data-rv-sizes]:not(.is-in) .sz rect { scale: 1 0; }
  .js [data-rv-sizes]:not(.is-in) .sz text { opacity: 0; }

  .js [data-rv-tiles] .dg { transform-origin: 50% 0; transition: opacity .3s ease, rotate .7s var(--ease-set), background-color .25s ease, border-color .25s ease; transition-delay: calc(var(--i) * 55ms); }
  .js [data-rv-tiles].is-done .dg { transition-delay: 0s; }
  .js [data-rv-tiles]:not(.is-in) .dg { opacity: 0; rotate: x 90deg; }

  /* işaretli fotoğraf: noktalar sırayla belirir */
  .js .craft:not(.is-in) .ann-dot { scale: 0; }
  .js .craft.is-in .ann-dot { animation: pop .5s cubic-bezier(.3, 1.5, .5, 1) backwards; }
  .js .craft.is-in .ann-dot::after { content: ""; position: absolute; inset: -5px; border: 2px solid #fff; opacity: 0; animation: ring 1.1s ease-out backwards; }
  .js .craft.is-in .ann-dot[data-n="1"], .js .craft.is-in .ann-dot[data-n="1"]::after { animation-delay: .9s; }
  .js .craft.is-in .ann-dot[data-n="2"], .js .craft.is-in .ann-dot[data-n="2"]::after { animation-delay: 1.25s; }
  .js .craft.is-in .ann-dot[data-n="3"], .js .craft.is-in .ann-dot[data-n="3"]::after { animation-delay: 1.6s; }

  /* SSS yumuşak açılma */
  @supports selector(::details-content) {
    :root { interpolate-size: allow-keywords; }
    .faq-list details::details-content { block-size: 0; overflow: hidden; transition: block-size .32s var(--ease-set), content-visibility .32s allow-discrete; }
    .faq-list details[open]::details-content { block-size: auto; }
  }

  .menu-open .mm-main li { animation: fade-up .5s var(--ease-set) both; animation-delay: calc(var(--i) * 45ms + 60ms); }
  .lb-frame.is-changing > img:first-child { animation: lbimg .3s ease-out; }
}
@keyframes pop { from { scale: 0; } }
@keyframes ring { 0% { opacity: .9; scale: 1; } 100% { opacity: 0; scale: 1.9; } }
@keyframes lbimg { from { opacity: 0; scale: .985; } }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; animation: none !important; }
}

/* =================================================================
   YENİ ANA SAYFA VE PROJE SUNUMU
   Mevcut siyah, beyaz, gri ve petrol paleti korunur.
   ================================================================= */
.photo-button {
  position: relative; display: block; width: 100%; min-width: 0; padding: 0; border: 0;
  overflow: hidden; background: var(--gece-2); color: #fff; cursor: zoom-in; text-align: left;
}
.photo-button > img:first-child { width: 100%; height: 100%; object-fit: cover; transition: scale .7s var(--ease-set); }
.photo-button:hover > img:first-child { scale: 1.025; }
.photo-button::after { content: ""; position: absolute; inset: 45% 0 0; z-index: 1; background: linear-gradient(transparent, rgba(9, 13, 14, .84)); pointer-events: none; }
.photo-label { position: absolute; z-index: 2; left: 18px; right: 18px; bottom: 16px; display: grid; gap: 3px; }
.photo-label strong { font-size: 1rem; line-height: 1.2; }
.photo-label small { color: rgba(255, 255, 255, .72); font-size: .75rem; line-height: 1.35; }
.photo-button .wm { z-index: 2; width: 84px; opacity: .48; }

.hero-v2 { overflow: hidden; padding-block: 52px 44px; }
.hero-v2-grid { display: grid; gap: 40px; }
.hero-v2-copy { display: block; align-content: center; }
.hero-v2 .kicker, .projects-hero .kicker { color: var(--petrol-acik); margin-bottom: 18px; }
.hero-v2 h1, .projects-hero h1 {
  max-width: 10ch; color: #f5f7f6; font-size: clamp(2.75rem, 1.7rem + 4vw, 5.65rem);
  line-height: .96; letter-spacing: -.025em;
}
.hero-v2-lead { max-width: 48ch; margin-top: 28px; color: #c4ccce; font-size: clamp(1.075rem, .98rem + .35vw, 1.3rem); line-height: 1.6; }
.hero-v2 .hero-actions { margin-top: 34px; gap: 12px; }
.hero-v2 .hero-v2-notes { display: flex; flex-wrap: wrap; gap: 10px 24px; margin: 36px 0 0; padding: 26px 0 0; border-top: 1px solid var(--gece-derz); list-style: none; }
.hero-v2-notes li { position: relative; padding-left: 15px; color: #9facb0; font-size: .875rem; }
.hero-v2-notes li::before { content: ""; position: absolute; left: 0; top: .62em; width: 5px; height: 5px; background: var(--petrol-acik); }
.hero-v2-media, .projects-hero-media { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr); gap: 8px; min-width: 0; }
.hero-v2-stack { display: grid; grid-template-rows: repeat(2, minmax(0, 1fr)); gap: 8px; min-width: 0; }
.hero-shot { height: 100%; min-height: 0; }
.hero-shot .photo-label { display: none; }
.hero-shot-main { min-height: 440px; }
.hero-v2-stack .hero-shot { min-height: 216px; }
.hero-v2 .btn-wa-light { color: #fff; border-color: #849095; }
.hero-v2 .btn-wa-light:hover { color: var(--grafit); }
.hero-v2 + .trust { padding-top: 30px; }

.featured-work { padding-top: clamp(72px, 8vw, 112px); }
.featured-head { display: grid; gap: 24px; margin-bottom: clamp(34px, 5vw, 64px); }
.featured-head > div { display: grid; align-content: start; gap: 18px; }
.featured-head h2 { max-width: 12ch; font-size: clamp(2.3rem, 1.45rem + 3vw, 4.5rem); line-height: .98; }
.featured-head > div:last-child p { max-width: 54ch; color: var(--tas-koyu); }
.featured-grid { display: grid; gap: 24px; }
.featured-stack { display: grid; gap: 24px; }
.featured-card { min-width: 0; }
.featured-card .photo-button { aspect-ratio: 4 / 3; }
.featured-card-wide .photo-button { aspect-ratio: 4 / 5; }
.featured-card h3 { margin-top: 14px; font-size: 1.25rem; }
.featured-card > p { margin-top: 5px; color: var(--tas-koyu); font-size: .9rem; }
.featured-card .photo-label { display: none; }

.projects-hero { padding-block: 42px; }
.projects-hero-grid { display: grid; gap: 42px; }
.projects-hero-copy { display: block; align-content: center; }
.projects-hero-copy > p:not(.kicker) { max-width: 50ch; margin-top: 26px; color: #c4ccce; font-size: 1.1rem; }
.projects-hero-copy dl { display: flex; gap: 28px; margin: 30px 0 0; padding-top: 24px; border-top: 1px solid var(--gece-derz); }
.projects-hero-copy dl > div { display: grid; gap: 4px; }
.projects-hero-copy dt { color: #fff; font-size: 2rem; font-weight: 800; line-height: 1; }
.projects-hero-copy dd { color: #929ea2; font-size: .8rem; }
.crumbs-dark { margin-bottom: 28px; }
.crumbs-dark a, .crumbs-dark li { color: #9eaaad; }
.projects-hero-media .hero-shot-main { min-height: 500px; }
.projects-hero-media .hero-v2-stack .hero-shot { min-height: 246px; }

.project-intro { padding-block: clamp(48px, 6vw, 88px); }
.project-intro-grid { display: grid; gap: 20px; }
.project-intro h2 { max-width: 14ch; font-size: clamp(2rem, 1.45rem + 2vw, 3.5rem); line-height: 1; }
.project-intro p { max-width: 56ch; color: var(--tas-koyu); }
.project-group { padding-block: clamp(64px, 8vw, 116px); border-top: 1px solid var(--derz); }
.project-group-head { display: grid; gap: 16px; margin-bottom: 34px; }
.project-group-head h2 { max-width: 16ch; font-size: clamp(2rem, 1.4rem + 2.1vw, 3.65rem); line-height: 1; }
.project-group-head p { max-width: 58ch; color: var(--tas-koyu); }
.project-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 30px 18px; margin: 0; padding: 0; list-style: none; }
.project-photo { display: block; min-width: 0; margin: 0; }
.project-photo button { position: relative; display: block; width: 100%; padding: 0; border: 0; overflow: hidden; background: var(--sva); cursor: zoom-in; }
.project-photo button { aspect-ratio: 4 / 5; }
.project-photo button > img:first-child { width: 100%; height: 100%; object-fit: cover; transition: scale .7s var(--ease-set); }
.project-photo button:hover > img:first-child { scale: 1.02; }
.project-photo .wm { width: 88px; }
.project-photo > div { padding-top: 12px; }
.project-photo h3 { font-size: 1rem; }
.project-photo p { margin-top: 3px; color: var(--tas-koyu); font-size: .82rem; line-height: 1.45; }
.projects-page .before-after { border-top: 1px solid var(--derz); }
.foot-brand a { color: #fff; text-underline-offset: 4px; }

@media (min-width: 700px) {
  .featured-grid { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); align-items: start; }
  .featured-card-wide .photo-button { aspect-ratio: 4 / 5; }
  .featured-stack { align-content: start; gap: 32px; }
  .featured-card:not(.featured-card-wide) .photo-button { aspect-ratio: 16 / 10; }
  .project-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (min-width: 900px) {
  .hero-v2 { padding-block: 0; }
  .hero-v2-grid { min-height: min(780px, calc(100svh - var(--header-h))); grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(44px, 6vw, 100px); align-items: center; }
  .hero-v2-copy { padding-block: 68px; }
  .hero-v2-media { height: min(700px, calc(100svh - var(--header-h) - 64px)); }
  .hero-shot-main, .hero-v2-stack .hero-shot { min-height: 0; }
  .featured-head { grid-template-columns: minmax(0, 7fr) minmax(320px, 5fr); gap: clamp(48px, 7vw, 110px); align-items: end; }
  .project-intro-grid, .project-group-head { grid-template-columns: minmax(0, 7fr) minmax(320px, 5fr); gap: clamp(48px, 7vw, 110px); align-items: end; }
  .projects-hero { padding-block: 0; }
  .projects-hero-grid { min-height: 680px; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(44px, 6vw, 100px); align-items: center; }
  .projects-hero-media { height: 600px; }
  .projects-hero-media .hero-shot-main, .projects-hero-media .hero-v2-stack .hero-shot { min-height: 0; }
}

@media (min-width: 1100px) {
  .project-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .project-grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (max-width: 699px) {
  .hero-v2 { padding-top: 36px; }
  .hero-v2 h1, .projects-hero h1 { max-width: 11ch; }
  .hero-v2-media, .projects-hero-media { margin-inline: calc(var(--gut) * -1); }
  .hero-v2 .hero-actions .btn { width: 100%; }
  .hero-v2 .hero-v2-notes { display: grid; gap: 10px; margin-top: 46px; padding-top: 28px; }
  .featured-card-wide .photo-button { aspect-ratio: 4 / 5; }
  .projects-hero-copy dl { gap: 20px; }
}

/* Bilgi bankası */
.knowledge-teaser { padding-block: clamp(72px, 9vw, 132px); }
.knowledge-teaser-grid { display: grid; gap: 42px; }
.knowledge-teaser-head .kicker { color: var(--petrol-acik); }
.knowledge-teaser-head h2 { max-width: 13ch; margin-top: 18px; color: #fff; font-size: clamp(2.25rem, 1.45rem + 2.7vw, 4.2rem); line-height: .98; }
.knowledge-teaser-head > p:not(.kicker) { max-width: 50ch; margin-top: 22px; color: var(--gece-metin); }
.knowledge-teaser-head .text-link { margin-top: 26px; color: var(--petrol-acik); }
.knowledge-teaser-list { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--gece-derz); }
.knowledge-teaser-list li { border-bottom: 1px solid var(--gece-derz); }
.knowledge-teaser-list a { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 16px; align-items: center; padding: 20px 0; color: #fff; text-decoration: none; }
.knowledge-teaser-list a > span:first-child { display: grid; gap: 4px; }
.knowledge-teaser-list small { color: var(--petrol-acik); font-size: .7rem; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; }
.knowledge-teaser-list strong { font-size: 1.08rem; line-height: 1.3; }
.knowledge-teaser-list .knowledge-desc { display: none; color: #98a4a7; font-size: .84rem; }
.knowledge-teaser-list .icon { color: var(--petrol-acik); }
.kb-hero, .article-hero, .contact-page-hero { padding-block: clamp(52px, 7vw, 104px); border-bottom: 1px solid var(--derz); }
.kb-hero-grid, .contact-page-hero-grid { display: grid; gap: 28px; align-items: end; }
.kb-hero .crumbs, .article-hero .crumbs, .contact-page-hero .crumbs { margin-bottom: 30px; }
.kb-hero .kicker, .article-hero .kicker, .contact-page-hero .kicker { margin-bottom: 18px; }
.kb-hero h1, .contact-page-hero h1 { max-width: 13ch; font-size: clamp(2.65rem, 1.55rem + 3.7vw, 5.35rem); line-height: .96; }
.kb-hero-grid > p, .contact-page-hero-grid > p { max-width: 54ch; color: var(--tas-koyu); font-size: clamp(1.05rem, .95rem + .35vw, 1.25rem); }
.contact-hero-side > p { max-width: 54ch; color: var(--tas-koyu); font-size: clamp(1.05rem, .95rem + .35vw, 1.25rem); }
.contact-hero-side .hero-actions { margin-top: 24px; }
.kb-grid { display: grid; gap: 1px; background: var(--derz); border: 1px solid var(--derz); }
.kb-card { min-width: 0; background: var(--kirec); }
.kb-card-photo { position: relative; display: block; overflow: hidden; background: var(--derz); aspect-ratio: 4 / 3; }
.kb-card-photo > img:first-child { width: 100%; height: 100%; object-fit: cover; transition: scale .65s var(--ease-set); }
.kb-card-photo:hover > img:first-child { scale: 1.025; }
.kb-card-photo .wm { width: 80px; }
.kb-card > div { padding: 24px 22px 28px; }
.kb-meta { margin-bottom: 10px; color: var(--petrol); font-size: .75rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; }
.kb-card h3 { font-size: 1.35rem; line-height: 1.18; }
.kb-card h3 a { color: var(--grafit); text-decoration: none; }
.kb-card h3 a:hover { color: var(--petrol); }
.kb-card > div > p:not(.kb-meta) { margin-top: 14px; color: var(--tas-koyu); font-size: .94rem; }
.kb-card .text-link { margin-top: 20px; font-size: .9rem; }
.kb-services { border-top: 1px solid var(--derz); }

.article-hero-grid { display: grid; gap: 38px; align-items: center; }
.article-hero h1 { max-width: 13ch; font-size: clamp(2.55rem, 1.5rem + 3.35vw, 5rem); line-height: .97; }
.article-hero h1 + p { max-width: 52ch; margin-top: 22px; color: var(--tas-koyu); font-size: 1.08rem; }
.article-hero figure .frame { aspect-ratio: 4 / 3; }
.article-body { padding-block: clamp(60px, 8vw, 120px); }
.article-layout { display: grid; gap: 48px; }
.article-layout > article { min-width: 0; }
.article-section + .article-section { margin-top: 60px; padding-top: 54px; border-top: 1px solid var(--derz); }
.article-section h2 { max-width: 18ch; font-size: clamp(2rem, 1.45rem + 1.7vw, 3rem); line-height: 1.02; }
.article-section > p { max-width: 68ch; margin-top: 22px; color: var(--tas-koyu); }
.article-section > p a { font-weight: 600; text-underline-offset: 4px; }
.article-primary { margin-top: 58px; padding: clamp(24px, 4vw, 42px); border-left: 4px solid var(--petrol); background: var(--sva); }
.article-primary h2 { max-width: 18ch; margin-top: 12px; font-size: clamp(1.55rem, 1.3rem + .8vw, 2.1rem); line-height: 1.08; }
.article-primary > p:not(.kicker) { max-width: 58ch; margin-top: 12px; color: var(--tas-koyu); }
.article-primary .text-link { margin-top: 20px; }
.article-points { display: grid; gap: 1px; margin-top: 30px; background: var(--derz); border: 1px solid var(--derz); }
.article-point { padding: 22px; background: var(--beyaz); }
.article-point h3 { font-size: 1.08rem; }
.article-point p { margin-top: 7px; color: var(--tas-koyu); font-size: .92rem; }
.article-layout aside { display: grid; align-content: start; gap: 18px; }
.article-summary, .article-help { padding: 28px 24px; border: 1px solid var(--derz); background: var(--beyaz); }
.article-summary h2, .article-help h2 { font-size: 1.3rem; }
.article-summary ul { margin: 18px 0 0; padding: 0; list-style: none; }
.article-summary li { position: relative; padding: 12px 0 12px 18px; border-top: 1px solid var(--derz); color: var(--tas-koyu); font-size: .92rem; }
.article-summary li::before { content: ""; position: absolute; left: 0; top: 1.35em; width: 6px; height: 6px; background: var(--petrol); }
.article-help { background: var(--gece); color: #fff; border-color: var(--gece); }
.article-help h2 { color: #fff; }
.article-help p { margin: 12px 0 20px; color: var(--gece-metin); font-size: .92rem; }
.article-help .btn { width: 100%; }

/* Yakın ilçe hizmet sayfaları */
.region-hero .hero-actions { margin-top: 28px; }
.region-hero figure .frame > img:first-child { width: 100%; height: 100%; object-fit: cover; }
.region-intro-grid { display: grid; gap: 30px; }
.region-intro h2 { max-width: 13ch; margin-top: 18px; font-size: clamp(2.2rem, 1.45rem + 2.3vw, 3.8rem); line-height: 1; }
.region-prose { max-width: 66ch; }
.region-prose > p { color: var(--tas-koyu); font-size: 1rem; line-height: 1.72; }
.region-prose > p + p { margin-top: 18px; }
.region-prose .text-link { color: var(--petrol-derin); }
.region-focus-grid { display: grid; gap: 1px; margin-top: 34px; padding: 1px; background: var(--derz); }
.region-focus-grid article { min-width: 0; padding: clamp(24px, 3vw, 38px); background: var(--beyaz); }
.region-focus-grid h3 { font-size: clamp(1.25rem, 1.1rem + .45vw, 1.6rem); line-height: 1.15; }
.region-focus-grid h3 a { color: var(--grafit); text-decoration: none; }
.region-focus-grid h3 a:hover { color: var(--petrol); }
.region-focus-grid p { margin-top: 13px; color: var(--tas-koyu); font-size: .94rem; }
.region-focus-grid .text-link { margin-top: 22px; font-size: .86rem; }
.local-area-grid h3 a { color: var(--grafit); text-underline-offset: 4px; }
.local-area-grid h3 a:hover { color: var(--petrol); }

/* İletişim formu */
.contact-page { padding-block: clamp(64px, 8vw, 120px); }
.contact-page-grid { display: grid; gap: 38px; }
.contact-details h2 { max-width: 13ch; margin-top: 20px; font-size: clamp(2.2rem, 1.5rem + 2.25vw, 3.75rem); line-height: 1; }
.contact-details > p:not(.kicker):not(.contact-tip) { max-width: 48ch; margin-top: 22px; color: var(--tas-koyu); }
.contact-details dl { margin-top: 32px; border-top: 1px solid var(--derz); }
.contact-details dl > div { display: grid; grid-template-columns: minmax(100px, .8fr) minmax(0, 1.4fr); gap: 20px; padding: 14px 0; border-bottom: 1px solid var(--derz); }
.contact-details dt { color: var(--tas-koyu); font-size: .85rem; }
.contact-details dd { font-weight: 600; }
.contact-details dd a { text-underline-offset: 4px; }
.contact-tip { margin-top: 28px; padding: 18px; border-left: 3px solid var(--petrol); background: var(--kirec); color: var(--tas-koyu); font-size: .9rem; }
.contact-service-links { display: flex; flex-wrap: wrap; gap: 8px 16px; margin-top: 24px; }
.contact-service-links a { color: var(--petrol-derin); font-size: .86rem; font-weight: 600; text-underline-offset: 4px; }
.contact-location { border-top: 1px solid var(--derz); border-bottom: 1px solid var(--derz); }
.contact-location-grid { display: grid; gap: 34px; align-items: stretch; }
.contact-location-copy { align-self: center; }
.contact-location-copy h2 { max-width: 12ch; margin-top: 18px; font-size: clamp(2.2rem, 1.55rem + 2.2vw, 3.8rem); line-height: 1; }
.contact-location-copy > p:not(.kicker) { max-width: 48ch; margin-top: 20px; color: var(--tas-koyu); }
.contact-location-copy address { max-width: 34ch; margin-top: 26px; font-size: clamp(1.05rem, .96rem + .35vw, 1.25rem); font-style: normal; font-weight: 700; line-height: 1.45; }
.contact-location-copy .text-link { margin-top: 24px; }
.contact-map { min-height: 360px; overflow: hidden; border: 1px solid var(--derz); background: var(--sva); }
.contact-map iframe { display: block; width: 100%; min-height: 360px; height: 100%; border: 0; filter: grayscale(.86) contrast(.96); }
.contact-form { align-self: start; background: var(--beyaz); border: 1px solid var(--derz); }
.form-head { display: flex; align-items: baseline; justify-content: space-between; gap: 20px; padding: 20px 22px; border-bottom: 1px solid var(--derz); }
.form-head span { font-size: 1.15rem; font-weight: 600; }
.form-head small { color: var(--tas-koyu); font-size: .78rem; }
.form-grid { display: grid; gap: 20px; padding: 24px 22px 12px; }
.contact-form label > span { display: block; margin-bottom: 8px; color: var(--tas-koyu); font-size: .84rem; font-weight: 600; }
.contact-form label > span small { font-weight: 400; }
.contact-form input, .contact-form select, .contact-form textarea {
  width: 100%; min-height: 50px; padding: 12px 13px; border: 1px solid var(--derz); border-radius: 0;
  background: var(--kirec); color: var(--grafit); font: inherit; font-size: .96rem;
}
.contact-form textarea { min-height: 146px; resize: vertical; line-height: 1.5; }
.contact-form input:focus, .contact-form select:focus, .contact-form textarea:focus { border-color: var(--petrol); outline: 1px solid var(--petrol); outline-offset: 0; }
.contact-form [aria-invalid="true"] { border-color: #9b3636; }
.bot-field { position: absolute !important; left: -10000px !important; width: 1px !important; height: 1px !important; overflow: hidden !important; }
.consent { display: flex; align-items: flex-start; gap: 11px; margin: 8px 22px 0; }
.consent input { width: 18px; min-height: 18px; height: 18px; flex: none; margin-top: 2px; accent-color: var(--petrol); }
.consent span { margin: 0 !important; font-weight: 400 !important; line-height: 1.45; }
.form-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 20px; padding: 24px 22px 26px; }
.contact-form button { cursor: pointer; }
.contact-form button[disabled] { cursor: wait; opacity: .66; }
.form-status { flex: 1 1 220px; min-height: 1.5em; color: var(--tas-koyu); font-size: .88rem; }
.form-status.is-success { color: #17613b; font-weight: 600; }
.form-status.is-error { color: #8c2929; }
.contact-next { padding-block: clamp(58px, 7vw, 96px); border-top: 1px solid var(--derz); }
.contact-next-grid { display: grid; gap: 1px; background: var(--derz); border: 1px solid var(--derz); }
.contact-next-grid li { padding: 26px 22px 30px; background: var(--beyaz); }
.contact-next-grid li > span { display: block; margin-bottom: 20px; color: var(--petrol); font-size: 2.25rem; font-weight: 800; line-height: 1; }
.contact-next-grid h3 { font-size: 1.2rem; }
.contact-next-grid p { margin-top: 8px; color: var(--tas-koyu); font-size: .92rem; }
.local-service-areas { border-top: 1px solid var(--derz); }
.local-area-grid { display: grid; gap: 1px; margin-top: 30px; padding: 1px; background: var(--derz); list-style: none; }
.local-area-grid li { min-width: 0; padding: clamp(22px, 3vw, 34px); background: var(--beyaz); }
.local-area-grid h3 { font-size: 1.2rem; }
.local-area-grid p { margin-top: 10px; color: var(--tas-koyu); font-size: .92rem; }
.local-area-cta { margin-top: 26px; }

/* Yönetim ekranı */
.admin-page { background: var(--kirec); }
.admin-page .mobile-bar { display: none; }
.admin-shell { min-height: calc(100svh - var(--header-h)); padding-block: clamp(48px, 6vw, 88px); }
.admin-top { display: flex; align-items: flex-end; justify-content: space-between; gap: 32px; }
.admin-top h1 { margin-top: 12px; font-size: clamp(2.5rem, 1.6rem + 3vw, 4.75rem); line-height: .95; }
.admin-top h1 + p { max-width: 56ch; margin-top: 18px; color: var(--tas-koyu); }
.admin-top-actions { display: flex; flex: none; gap: 18px; align-items: center; }
.admin-top-actions a { color: var(--tas-koyu); font-size: .86rem; font-weight: 600; text-underline-offset: 4px; }
.admin-signout { flex: none; color: var(--tas-koyu); font-size: .86rem; }
.admin-overview { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; margin-top: 46px; padding: 1px; background: var(--derz); }
.admin-overview article { min-width: 0; padding: clamp(18px, 3vw, 28px); background: var(--beyaz); }
.admin-overview span, .admin-overview small { display: block; color: var(--tas-koyu); }
.admin-overview span { font-size: .74rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.admin-overview strong { display: block; margin-top: 12px; color: var(--grafit); font-size: clamp(2rem, 1.5rem + 1.5vw, 3.2rem); line-height: 1; }
.admin-overview small { margin-top: 8px; font-size: .78rem; }
.admin-seo { margin-top: 48px; padding-top: 42px; border-top: 1px solid var(--derz); }
.admin-section-head { display: grid; gap: 12px; }
.admin-section-head h2 { font-size: clamp(2rem, 1.5rem + 1.6vw, 3.2rem); line-height: 1; }
.admin-section-head > p:last-child { max-width: 68ch; color: var(--tas-koyu); }
.admin-seo-grid { display: grid; gap: 1px; margin-top: 28px; padding: 1px; background: var(--derz); }
.admin-seo-grid article { min-width: 0; padding: 24px; background: var(--beyaz); }
.admin-seo-grid article > span { color: var(--petrol); font-size: .7rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.admin-seo-grid h3 { margin-top: 9px; font-size: 1.2rem; overflow-wrap: anywhere; }
.admin-seo-grid p { margin-top: 9px; color: var(--tas-koyu); font-size: .88rem; }
.admin-seo-grid a { display: inline-block; margin-top: 18px; color: var(--petrol-derin); font-size: .86rem; font-weight: 600; text-underline-offset: 4px; }
.admin-critical { margin-top: 18px; padding: 22px; border: 1px solid var(--derz); background: var(--beyaz); }
.admin-critical h3 { font-size: 1rem; }
.admin-critical > div { display: flex; flex-wrap: wrap; gap: 8px 18px; margin-top: 12px; }
.admin-critical a { font-size: .85rem; font-weight: 600; text-underline-offset: 4px; }
.admin-dns { margin-top: 14px; border: 1px solid var(--derz); background: var(--beyaz); }
.admin-dns summary { padding: 17px 20px; cursor: pointer; font-weight: 600; }
.admin-dns-table { padding: 0 20px 20px; }
.admin-dns-table p { display: grid; grid-template-columns: 44px minmax(130px, .8fr) minmax(0, 2fr); gap: 12px; padding: 10px 0; border-top: 1px solid var(--derz); align-items: start; }
.admin-dns-table strong { color: var(--petrol); font-size: .76rem; }
.admin-dns-table code { min-width: 0; overflow-wrap: anywhere; font-size: .76rem; }
.admin-panel { margin-top: 58px; }
.admin-controls { display: grid; gap: 12px; margin-top: 26px; padding: 18px; border: 1px solid var(--derz); background: var(--beyaz); }
.admin-controls label > span { display: block; margin-bottom: 7px; color: var(--tas-koyu); font-size: .74rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.admin-controls input, .admin-controls select { width: 100%; min-height: 44px; padding: 9px 11px; border: 1px solid var(--derz); background: var(--kirec); color: var(--grafit); font: inherit; font-size: .88rem; }
.admin-controls input:focus, .admin-controls select:focus { border-color: var(--petrol); outline: 1px solid var(--petrol); }
.admin-control-actions { display: flex; gap: 8px; align-items: end; }
.admin-control-actions button { flex: 1; min-height: 44px; padding: 9px 13px; border: 1px solid var(--grafit); background: var(--grafit); color: #fff; cursor: pointer; font: inherit; font-size: .84rem; font-weight: 600; }
.admin-control-actions button:last-child { border-color: var(--petrol); background: var(--petrol); }
.admin-control-actions button:disabled { cursor: not-allowed; opacity: .45; }
.admin-toolbar { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 16px; margin-top: 12px; padding: 14px 18px; border: 1px solid var(--derz); background: var(--beyaz); }
.admin-stats { display: flex; align-items: center; gap: 14px; color: var(--tas-koyu); font-size: .9rem; }
.admin-stats strong { color: var(--grafit); font-size: 1.35rem; }
.admin-filters { display: flex; flex-wrap: wrap; gap: 7px; }
.admin-filters button { display: inline-flex; gap: 8px; align-items: center; padding: 9px 11px; border: 1px solid var(--derz); background: transparent; cursor: pointer; font-size: .84rem; }
.admin-filters button strong { display: inline-flex; min-width: 21px; min-height: 21px; align-items: center; justify-content: center; padding-inline: 5px; background: var(--sva); color: var(--tas-koyu); font-size: .68rem; }
.admin-filters button.is-active { border-color: var(--petrol); background: var(--petrol); color: #fff; }
.admin-filters button.is-active strong { background: rgba(255,255,255,.16); color: #fff; }
.admin-result-summary { min-height: 22px; margin-top: 16px; color: var(--tas-koyu); font-size: .84rem; }
.admin-list { display: grid; gap: 12px; margin-top: 16px; }
.admin-card { display: grid; gap: 22px; padding: 22px; border: 1px solid var(--derz); background: var(--beyaz); }
.admin-card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; }
.admin-card h2 { font-size: 1.2rem; }
.admin-card-time { color: var(--tas-koyu); font-size: .78rem; }
.admin-card-grid { display: grid; gap: 16px; }
.admin-field span { display: block; margin-bottom: 3px; color: var(--tas-koyu); font-size: .73rem; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; }
.admin-field a { font-weight: 600; text-underline-offset: 4px; }
.admin-message { padding: 16px; background: var(--kirec); white-space: pre-wrap; overflow-wrap: anywhere; }
.admin-card-actions { display: grid; gap: 12px; align-content: start; }
.admin-card-actions label > span { display: block; margin-bottom: 6px; color: var(--tas-koyu); font-size: .73rem; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; }
.admin-card-actions select { width: 100%; min-height: 42px; padding: 8px 12px; border: 1px solid var(--derz); background: var(--kirec); font: inherit; font-size: .86rem; }
.admin-quick-actions { display: grid; gap: 6px; }
.admin-quick-actions a { display: flex; min-height: 40px; align-items: center; justify-content: center; padding: 8px 12px; border: 1px solid var(--derz); color: var(--grafit); font-size: .82rem; font-weight: 600; text-align: center; }
.admin-quick-actions a:first-child { border-color: var(--petrol); background: var(--petrol); color: #fff; }
.status-chip { display: inline-flex; padding: 5px 9px; background: var(--sva); color: var(--tas-koyu); font-size: .72rem; font-weight: 600; }
.status-chip[data-status="new"] { background: #d9edf2; color: var(--petrol-derin); }
.status-chip[data-status="contacted"] { background: #e7e7e1; color: var(--grafit); }
.status-chip[data-status="closed"] { background: var(--grafit); color: #fff; }
.admin-login, .admin-error, .admin-empty { margin-top: 16px; padding: 34px 28px; border: 1px solid var(--derz); background: var(--beyaz); }
.admin-login h2 { font-size: 1.6rem; }
.admin-login p { margin: 10px 0 22px; color: var(--tas-koyu); }
.admin-error { color: #7d2323; }

@media (min-width: 700px) {
  .kb-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .article-points, .form-grid, .contact-next-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .form-wide { grid-column: 1 / -1; }
  .contact-next-grid li:last-child { grid-column: 1 / -1; }
  .admin-card-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .admin-controls { grid-template-columns: minmax(240px, 2fr) repeat(3, minmax(140px, 1fr)); }
  .admin-control-actions { grid-column: 1 / -1; justify-content: flex-end; }
  .admin-control-actions button { flex: 0 0 auto; min-width: 120px; }
  .local-area-grid, .admin-seo-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .region-focus-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (min-width: 900px) {
  .knowledge-teaser-grid { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(48px, 7vw, 112px); align-items: start; }
  .knowledge-teaser-list a { grid-template-columns: minmax(200px, 1.05fr) minmax(240px, 1.4fr) auto; padding-block: 24px; }
  .knowledge-teaser-list .knowledge-desc { display: block; }
  .kb-hero-grid, .contact-page-hero-grid { grid-template-columns: minmax(0, 7fr) minmax(300px, 5fr); gap: clamp(52px, 7vw, 112px); }
  .kb-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .article-hero-grid { grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: clamp(48px, 7vw, 112px); }
  .article-layout { grid-template-columns: minmax(0, 8fr) minmax(280px, 4fr); gap: clamp(48px, 7vw, 112px); align-items: start; }
  .article-layout aside { position: sticky; top: calc(var(--header-h) + 28px); }
  .contact-page-grid { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(48px, 7vw, 116px); align-items: start; }
  .contact-location-grid { grid-template-columns: minmax(0, 4fr) minmax(440px, 7fr); gap: clamp(48px, 6vw, 96px); }
  .contact-map, .contact-map iframe { min-height: 480px; }
  .contact-next-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .contact-next-grid li:last-child { grid-column: auto; }
  .admin-card { grid-template-columns: minmax(190px, 2fr) minmax(0, 5fr) auto; align-items: start; }
  .admin-card-head { display: block; }
  .admin-card-time { margin-top: 7px; }
  .admin-overview { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .local-area-grid, .admin-seo-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .region-intro-grid { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(48px, 7vw, 112px); align-items: start; }
}

@media (min-width: 1100px) {
  .main-nav { gap: 22px; margin-right: 6px; }
  .main-nav a { font-size: .875rem; }
}

@media (max-width: 699px) {
  .form-head { display: grid; gap: 3px; }
  .form-actions .btn { width: 100%; }
  .contact-details dl > div { grid-template-columns: 1fr; gap: 3px; }
  .admin-top { display: block; }
  .admin-top-actions { margin-top: 20px; }
  .admin-toolbar { align-items: stretch; }
  .admin-filters { width: 100%; }
  .admin-filters button { flex: 1 1 calc(50% - 7px); }
  .admin-control-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .admin-dns-table p { grid-template-columns: 42px minmax(0, 1fr); }
  .admin-dns-table code:last-child { grid-column: 1 / -1; }
}

/* Bağımsız yönetim uygulaması */
.admin-page { background: #edf0f1; }
.admin-page > .site-header,
.admin-page > .site-footer,
.admin-page > .mobile-bar,
.admin-page > .lightbox,
.admin-page > .cursor-preview { display: none !important; }
.admin-page #icerik { min-height: 100svh; }
.admin-page [hidden] { display: none !important; }
.admin-app { min-height: 100svh; color: #172126; }
.admin-app.is-auth-pending .admin-sidebar,
.admin-app.is-login .admin-sidebar,
.admin-app.is-auth-pending .admin-appbar,
.admin-app.is-login .admin-appbar { display: none; }
.admin-app.is-login .admin-workspace { display: grid; min-height: 100svh; align-items: center; }
.admin-sidebar { display: flex; flex-direction: column; min-width: 0; padding: 24px 18px; background: #10191d; color: #f4f5f2; }
.admin-brand { display: flex; align-items: baseline; gap: 5px; padding: 6px 8px 27px; border-bottom: 1px solid rgba(255,255,255,.1); }
.admin-brand strong { font-size: 1.62rem; font-weight: 800; letter-spacing: -.06em; line-height: 1; }
.admin-brand span { color: #9fa9ad; font-size: .76rem; }
.admin-nav { display: flex; gap: 6px; margin-top: 18px; overflow-x: auto; }
.admin-nav button { position: relative; display: grid; grid-template-columns: 23px minmax(max-content, 1fr) auto; gap: 10px; align-items: center; min-width: max-content; padding: 13px 14px; border: 0; background: transparent; color: #98a3a7; cursor: pointer; font: inherit; text-align: left; }
.admin-nav button > span { color: #647177; font-size: .68rem; font-weight: 700; }
.admin-nav button > strong { font-size: .84rem; font-weight: 600; }
.admin-nav button > em { display: inline-flex; min-width: 23px; min-height: 23px; align-items: center; justify-content: center; padding-inline: 6px; border-radius: 20px; background: rgba(255,255,255,.08); color: #cbd1d3; font-size: .67rem; font-style: normal; }
.admin-nav button:hover { color: #fff; }
.admin-nav button.is-active { background: #213138; color: #fff; }
.admin-nav button.is-active::before { position: absolute; inset-block: 0; left: 0; width: 3px; background: #66a9ba; content: ''; }
.admin-nav button.is-active > span { color: #87c2d0; }
.admin-nav button.is-active > em { background: #2f6f80; color: #fff; }
.admin-sidebar-bottom { display: none; }
.admin-workspace { min-width: 0; }
.admin-appbar { display: flex; min-height: 94px; align-items: center; justify-content: space-between; gap: 24px; padding: 20px clamp(20px, 4vw, 52px); border-bottom: 1px solid #d9dfe1; background: rgba(249,250,249,.92); }
.admin-appbar p { margin-bottom: 5px; color: #758087; font-size: .7rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.admin-appbar h1 { font-size: clamp(1.35rem, 1.1rem + .7vw, 2rem); letter-spacing: -.035em; line-height: 1; }
.admin-live { display: inline-flex; align-items: center; gap: 8px; color: #4f5d63; font-size: .76rem; font-weight: 600; white-space: nowrap; }
.admin-live i, .admin-sidebar-bottom i, .admin-system-grid strong i { width: 7px; height: 7px; border-radius: 50%; background: #2d9a62; box-shadow: 0 0 0 4px rgba(45,154,98,.12); }
.admin-auth-content { padding: clamp(24px, 4vw, 52px); }
.admin-view { max-width: 1420px; margin-inline: auto; }
.admin-view-intro { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; }
.admin-view-intro p, .admin-card-title span { margin-bottom: 8px; color: #66757b; font-size: .68rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.admin-view-intro h2 { font-size: clamp(2rem, 1.35rem + 2vw, 3.35rem); letter-spacing: -.055em; line-height: .98; }
.admin-view-intro h2 + span { display: block; max-width: 68ch; margin-top: 12px; color: #647178; font-size: .9rem; }
.admin-view-intro > button, .admin-card-title > button { min-height: 40px; padding: 9px 14px; border: 1px solid #ced5d8; background: #fff; color: #28353a; cursor: pointer; font: inherit; font-size: .78rem; font-weight: 600; }
.admin-view-intro > button:hover, .admin-card-title > button:hover { border-color: #2f6f80; color: #2f6f80; }
.admin-overview { gap: 12px; margin-top: 28px; padding: 0; background: transparent; }
.admin-overview article { position: relative; padding: 22px; border: 1px solid #d9dfe1; background: #fff; overflow: hidden; }
.admin-overview article::after { position: absolute; right: -18px; bottom: -35px; width: 92px; height: 92px; border-radius: 50%; background: #f0f4f5; content: ''; }
.admin-overview article:nth-child(2)::after { background: #e4f0f3; }
.admin-overview span { color: #657279; font-size: .69rem; }
.admin-overview strong { position: relative; z-index: 1; margin-top: 18px; font-size: clamp(2.15rem, 1.6rem + 1.7vw, 3.45rem); letter-spacing: -.06em; }
.admin-overview small { position: relative; z-index: 1; margin-top: 9px; color: #78848a; }
.admin-dashboard-grid { display: grid; gap: 14px; margin-top: 14px; }
.admin-dashboard-card { min-width: 0; border: 1px solid #d9dfe1; background: #fff; }
.admin-card-title { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 21px 22px; border-bottom: 1px solid #e1e5e7; }
.admin-card-title span { display: block; }
.admin-card-title h2 { font-size: 1.18rem; letter-spacing: -.025em; }
.admin-recent { min-height: 255px; }
.admin-recent-row { display: grid; grid-template-columns: minmax(150px, 1fr) auto; gap: 9px 16px; width: 100%; align-items: center; padding: 17px 22px; border: 0; border-bottom: 1px solid #e5e8e9; background: transparent; color: inherit; cursor: pointer; font: inherit; text-align: left; }
.admin-recent-row:hover { background: #f7f9f9; }
.admin-recent-row:last-child { border-bottom: 0; }
.admin-recent-person { min-width: 0; }
.admin-recent-person strong, .admin-recent-person small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.admin-recent-person strong { font-size: .9rem; }
.admin-recent-person small { margin-top: 4px; color: #738086; font-size: .74rem; }
.admin-recent-row time { grid-column: 1 / -1; color: #8a9498; font-size: .7rem; }
.admin-recent-empty { display: grid; min-height: 255px; place-content: center; gap: 7px; padding: 28px; color: #718087; text-align: center; }
.admin-recent-empty strong { color: #2a363b; font-size: 1rem; }
.admin-recent-empty span { max-width: 42ch; font-size: .8rem; }
.admin-shortcuts > a { display: block; padding: 18px 22px; border-bottom: 1px solid #e5e8e9; color: #263238; text-decoration: none; }
.admin-shortcuts > a:last-child { border-bottom: 0; }
.admin-shortcuts > a:hover { background: #f7f9f9; }
.admin-shortcuts > a strong, .admin-shortcuts > a span { display: block; }
.admin-shortcuts > a strong { font-size: .86rem; }
.admin-shortcuts > a span { margin-top: 4px; color: #748087; font-size: .74rem; }
.admin-system-grid { display: grid; gap: 12px; margin-top: 14px; }
.admin-system-grid article { padding: 18px 20px; border: 1px solid #d9dfe1; background: #fff; }
.admin-system-grid article > span, .admin-system-grid small { display: block; color: #758187; font-size: .7rem; }
.admin-system-grid strong { display: flex; align-items: center; gap: 9px; margin-top: 12px; font-size: .92rem; }
.admin-system-grid small { margin-top: 6px; line-height: 1.5; }
.admin-focus-pages { margin-top: 14px; border: 1px solid #d9dfe1; background: #fff; }
.admin-focus-pages > div:last-child { display: grid; }
.admin-focus-pages > div:last-child button { display: flex; min-width: 0; align-items: center; justify-content: space-between; gap: 16px; padding: 17px 20px; border: 0; border-bottom: 1px solid #e3e7e8; background: transparent; color: #263238; cursor: pointer; font: inherit; text-align: left; }
.admin-focus-pages > div:last-child button:last-child { border-bottom: 0; }
.admin-focus-pages > div:last-child button:hover { background: #f5f8f8; }
.admin-focus-pages button strong { font-size: .84rem; }
.admin-focus-pages button span { max-width: 55%; overflow: hidden; color: #7a868b; font-size: .7rem; text-overflow: ellipsis; white-space: nowrap; }
.admin-page .admin-login, .admin-page .admin-error { max-width: 700px; margin: clamp(32px, 6vw, 84px) auto; padding: clamp(28px, 5vw, 56px); border: 1px solid #d5dcde; background: #fff; }
.admin-page .admin-login > span { color: #2f6f80; font-size: .7rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.admin-page .admin-login h2 { margin-top: 11px; font-size: clamp(1.7rem, 1.25rem + 1.4vw, 2.7rem); letter-spacing: -.045em; }
.admin-page .admin-login p { max-width: 50ch; }
.admin-page .admin-error { color: #7d2323; }
.admin-page .admin-controls { margin-top: 28px; border-color: #d9dfe1; }
.admin-page .admin-toolbar { border-color: #d9dfe1; }
.admin-page .admin-card { border-color: #d9dfe1; }
.admin-page .admin-seo { margin-top: 0; padding-top: 0; border-top: 0; }
.admin-page .admin-seo-grid { gap: 12px; margin-top: 28px; padding: 0; background: transparent; }
.admin-page .admin-seo-grid article { border: 1px solid #d9dfe1; }
.admin-page .admin-critical, .admin-page .admin-dns { border-color: #d9dfe1; }

/* İçerik yönetimi */
.cms-login-form { display: grid; gap: 15px; max-width: 460px; margin-top: 26px; }
.cms-login-form label > span,
.cms-editor-fields label > span,
.cms-publish-box label > span,
.cms-settings-grid label > span,
.cms-site-card label > span,
.cms-pages-toolbar label > span { display: block; margin-bottom: 7px; color: #5f6d73; font-size: .7rem; font-weight: 700; letter-spacing: .055em; text-transform: uppercase; }
.cms-login-form input,
.cms-editor-fields input,
.cms-editor-fields textarea,
.cms-publish-box select,
.cms-settings-grid input,
.cms-site-card input,
.cms-site-card textarea,
.cms-pages-toolbar input,
.cms-pages-toolbar select { width: 100%; min-height: 46px; padding: 10px 12px; border: 1px solid #cfd6d8; border-radius: 0; background: #fff; color: #172126; font: inherit; font-size: .88rem; }
.cms-password-control { display: grid; grid-template-columns: minmax(0, 1fr) auto; }
.cms-password-control input { border-right: 0; }
.cms-password-control button { min-width: 74px; padding: 9px 12px; border: 1px solid #cfd6d8; background: #f3f5f5; color: #36515b; cursor: pointer; font: inherit; font-size: .74rem; font-weight: 700; }
.cms-password-control:focus-within { outline: 2px solid rgba(47,111,128,.12); }
.cms-password-control:focus-within input, .cms-password-control:focus-within button { border-color: #2f6f80; outline: 0; }
.cms-site-card textarea { min-height: 94px; resize: vertical; }
.cms-editor-fields textarea { min-height: 96px; resize: vertical; }
.cms-login-form input:focus,
.cms-editor-fields input:focus,
.cms-editor-fields textarea:focus,
.cms-publish-box select:focus,
.cms-settings-grid input:focus,
.cms-site-card input:focus,
.cms-site-card textarea:focus,
.cms-pages-toolbar input:focus,
.cms-pages-toolbar select:focus { border-color: #2f6f80; outline: 2px solid rgba(47,111,128,.12); outline-offset: 0; }
.cms-login-form .btn { width: max-content; margin-top: 3px; }
.cms-login-form [data-cms-login-status],
.cms-publish-box [data-cms-save-status],
.cms-site-actions [data-cms-site-status],
.cms-settings-grid [data-cms-password-status] { min-height: 18px; margin: 0; color: #5e6b71; font-size: .76rem; }
.cms-login-form [data-cms-login-status].is-error,
.cms-publish-box [data-cms-save-status].is-error,
.cms-site-actions [data-cms-site-status].is-error,
.cms-settings-grid [data-cms-password-status].is-error { color: #8b2c2c; }
.cms-site-actions [data-cms-site-status].is-success { color: #26704a; }
.admin-shortcuts > button { display: block; width: 100%; padding: 18px 22px; border: 0; border-bottom: 1px solid #e5e8e9; background: transparent; color: #263238; cursor: pointer; font: inherit; text-align: left; }
.admin-shortcuts > button:hover { background: #f7f9f9; }
.admin-shortcuts > button strong, .admin-shortcuts > button span { display: block; }
.admin-shortcuts > button strong { font-size: .86rem; }
.admin-shortcuts > button span { margin-top: 4px; color: #748087; font-size: .74rem; }
.cms-pages-toolbar { display: grid; gap: 12px; margin-top: 28px; padding: 18px; border: 1px solid #d9dfe1; background: #fff; }
.cms-pages-list { margin-top: 14px; border: 1px solid #d9dfe1; background: #fff; overflow-x: auto; }
.cms-page-table-head { display: none; padding: 11px 20px; border-bottom: 1px solid #d9dfe1; background: #f2f4f4; color: #758187; font-size: .66rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
.cms-page-table > article { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px 16px; align-items: center; padding: 17px 20px; border-bottom: 1px solid #e2e6e7; }
.cms-page-table > article:last-child { border-bottom: 0; }
.cms-page-table > article:hover { background: #f7f9f9; }
.cms-page-table > article > div:first-child { min-width: 0; }
.cms-page-table > article > div:first-child strong, .cms-page-table > article > div:first-child small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cms-page-table > article > div:first-child strong { font-size: .9rem; }
.cms-page-table > article > div:first-child small { margin-top: 4px; color: #758187; font-size: .71rem; }
.cms-page-table > article > span:not(.cms-status), .cms-page-table > article > time { display: none; color: #68767c; font-size: .72rem; }
.cms-status { display: inline-flex; width: max-content; align-items: center; min-height: 25px; padding: 4px 8px; border: 1px solid #d4dcde; color: #5b686e; font-size: .66rem; font-weight: 700; }
.cms-status[data-status="published"] { border-color: #b8d8c8; background: #eef7f2; color: #26704a; }
.cms-status[data-status="draft"] { border-color: #dfd6b8; background: #fbf7e9; color: #735e1a; }
.cms-page-actions { display: flex; grid-column: 1 / -1; gap: 7px; }
.cms-page-actions button, .cms-page-actions a { min-height: 34px; padding: 7px 10px; border: 1px solid #cfd6d8; background: #fff; color: #28353a; cursor: pointer; font: inherit; font-size: .7rem; font-weight: 600; line-height: 18px; text-decoration: none; }
.cms-page-actions button:hover, .cms-page-actions a:hover { border-color: #2f6f80; color: #2f6f80; }
.cms-page-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px 18px; align-items: center; width: 100%; padding: 18px 20px; border: 0; border-bottom: 1px solid #e2e6e7; background: transparent; color: inherit; cursor: pointer; font: inherit; text-align: left; }
.cms-page-row:last-child { border-bottom: 0; }
.cms-page-row:hover { background: #f7f9f9; }
.cms-page-row-main { min-width: 0; }
.cms-page-row-main strong, .cms-page-row-main small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cms-page-row-main strong { font-size: .94rem; }
.cms-page-row-main small { margin-top: 5px; color: #758187; font-size: .73rem; }
.cms-page-row-meta { display: flex; align-items: center; gap: 12px; }
.cms-page-status { display: inline-flex; align-items: center; min-height: 25px; padding: 4px 8px; border: 1px solid #d4dcde; color: #5b686e; font-size: .67rem; font-weight: 700; }
.cms-page-status.is-published { border-color: #b8d8c8; background: #eef7f2; color: #26704a; }
.cms-page-status.is-draft { border-color: #dfd6b8; background: #fbf7e9; color: #735e1a; }
.cms-page-row time { display: none; color: #849095; font-size: .7rem; }
.cms-list-empty { padding: 48px 22px; color: #718087; text-align: center; }
.cms-editor-form { display: grid; gap: 14px; margin-top: 28px; }
.cms-editor-main { min-width: 0; }
.cms-editor-fields { display: grid; gap: 16px; padding: 22px; border: 1px solid #d9dfe1; background: #fff; }
.cms-editor-fields small { display: block; margin-top: 7px; color: #7a868b; font-size: .7rem; }
.cms-slug-field { display: flex; align-items: stretch; border: 1px solid #cfd6d8; background: #f3f5f5; }
.cms-slug-field:focus-within { border-color: #2f6f80; outline: 2px solid rgba(47,111,128,.12); }
.cms-slug-field b { display: none; align-items: center; padding: 0 12px; color: #69767b; font-size: .76rem; font-weight: 500; white-space: nowrap; }
.cms-slug-field input { min-width: 0; border: 0; outline: 0 !important; }
.cms-slug-field input:disabled { background: #f0f2f2; color: #6f7a7e; }
.cms-content-editor { margin-top: 14px; border: 1px solid #d9dfe1; background: #fff; }
.cms-editor-toolbar { display: flex; flex-wrap: wrap; gap: 5px; padding: 10px; border-bottom: 1px solid #dde2e3; background: #f5f7f7; }
.cms-editor-toolbar button { min-height: 34px; padding: 6px 10px; border: 1px solid #d2d9db; background: #fff; color: #344247; cursor: pointer; font: inherit; font-size: .72rem; }
.cms-editor-toolbar button:hover { border-color: #2f6f80; color: #2f6f80; }
.cms-editor-canvas { min-height: 520px; padding: clamp(22px, 4vw, 48px); background: #fff; color: #1d282d; font-size: .98rem; line-height: 1.72; outline: 0; }
.cms-editor-canvas:focus { box-shadow: inset 0 0 0 2px rgba(47,111,128,.18); }
.cms-editor-canvas h1 { margin: 0 0 24px; font-size: clamp(2rem, 1.55rem + 1.4vw, 3.2rem); letter-spacing: -.05em; line-height: 1.03; }
.cms-editor-canvas h2 { margin: 38px 0 15px; font-size: clamp(1.5rem, 1.22rem + .8vw, 2.1rem); letter-spacing: -.035em; line-height: 1.08; }
.cms-editor-canvas h3 { margin: 28px 0 10px; font-size: 1.22rem; }
.cms-editor-canvas p, .cms-editor-canvas ul, .cms-editor-canvas ol { margin: 0 0 17px; }
.cms-editor-canvas img { max-width: 100%; height: auto; }
.cms-editor-canvas a { color: #245f70; text-decoration: underline; text-underline-offset: 3px; }
.cms-publish-box { align-self: start; padding: 22px; border: 1px solid #d9dfe1; background: #fff; }
.cms-publish-box h3 { margin-bottom: 20px; font-size: 1.2rem; }
.cms-publish-box .btn { width: 100%; margin-top: 18px; }
.cms-publish-box > a { display: block; margin-top: 16px; color: #2f6f80; font-size: .78rem; font-weight: 600; text-underline-offset: 4px; }
.cms-dirty-note { margin-top: 12px; color: #8a641c; font-size: .72rem; }
.cms-editor-info { margin-top: 22px; padding-top: 18px; border-top: 1px solid #e0e5e6; }
.cms-editor-info span, .cms-editor-info strong { display: block; }
.cms-editor-info span { color: #7a868b; font-size: .68rem; text-transform: uppercase; }
.cms-editor-info strong { margin-top: 6px; font-size: .76rem; font-weight: 500; }
.cms-seo-audit, .cms-search-preview { margin-top: 20px; padding-top: 18px; border-top: 1px solid #e0e5e6; }
.cms-seo-audit > div { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.cms-seo-audit > div > span, .cms-search-preview > span { color: #6d7a80; font-size: .67rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.cms-seo-audit > div > strong { color: #8b3a2b; font-size: .78rem; }
.cms-seo-audit > div > strong[data-score="medium"] { color: #8a641c; }
.cms-seo-audit > div > strong[data-score="good"] { color: #26704a; }
.cms-seo-audit ul { display: grid; gap: 8px; margin: 14px 0 0; padding: 0; list-style: none; }
.cms-seo-audit li { display: flex; align-items: flex-start; gap: 8px; color: #69767b; font-size: .7rem; line-height: 1.4; }
.cms-seo-audit li i { flex: 0 0 7px; width: 7px; height: 7px; margin-top: 3px; border-radius: 50%; background: #ba7d45; }
.cms-seo-audit li.is-pass i { background: #2d9a62; }
.cms-search-preview > * { display: block; }
.cms-search-preview small { margin-top: 12px; color: #3d7954; font-size: .67rem; line-height: 1.35; overflow-wrap: anywhere; }
.cms-search-preview strong { margin-top: 5px; color: #2859a7; font-size: .88rem; font-weight: 500; line-height: 1.3; }
.cms-search-preview p { display: -webkit-box; margin-top: 5px; overflow: hidden; color: #5f6368; font-size: .7rem; line-height: 1.45; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.cms-settings-grid { display: grid; gap: 14px; margin-top: 28px; }
.cms-settings-grid form, .cms-settings-grid article { padding: clamp(22px, 4vw, 34px); border: 1px solid #d9dfe1; background: #fff; }
.cms-settings-grid form { display: grid; gap: 15px; }
.cms-settings-grid h3 { margin-bottom: 6px; font-size: 1.22rem; }
.cms-settings-grid article > span { color: #6e7b80; font-size: .69rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.cms-settings-grid article h3 { margin-top: 12px; }
.cms-settings-grid article p { max-width: 54ch; margin: 12px 0 22px; color: #66747a; font-size: .86rem; line-height: 1.6; }
.cms-settings-grid article button { min-height: 42px; padding: 9px 14px; border: 1px solid #cfd6d8; background: #fff; color: #28353a; cursor: pointer; font: inherit; font-size: .78rem; font-weight: 600; }
.cms-site-form { margin-top: 28px; }
.cms-site-grid { display: grid; gap: 14px; }
.cms-site-card { display: grid; min-width: 0; gap: 15px; margin: 0; padding: clamp(22px, 3vw, 32px); border: 1px solid #d9dfe1; background: #fff; }
.cms-site-card legend { width: 100%; margin: 0 0 5px; padding: 0; color: #1f2b30; font-size: 1.16rem; font-weight: 700; letter-spacing: -.02em; }
.cms-site-card > p { margin-top: auto; padding-top: 14px; border-top: 1px solid #e1e5e7; color: #68767c; font-size: .8rem; line-height: 1.55; }
.cms-site-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; margin-top: 14px; padding: 18px; border: 1px solid #d9dfe1; background: #fff; }
.cms-site-actions .btn { width: max-content; }

@media (min-width: 700px) {
  .cms-pages-toolbar { grid-template-columns: minmax(260px, 1fr) 190px 160px; }
  .cms-page-table { min-width: 760px; }
  .cms-page-table-head { display: grid; grid-template-columns: minmax(220px, 1.5fr) 100px 110px 145px 130px; gap: 16px; }
  .cms-page-table > article { grid-template-columns: minmax(220px, 1.5fr) 100px 110px 145px 130px; gap: 16px; }
  .cms-page-table > article > span:not(.cms-status), .cms-page-table > article > time { display: block; }
  .cms-page-actions { grid-column: auto; justify-content: flex-end; }
  .cms-page-row { grid-template-columns: minmax(0, 1fr) auto auto; }
  .cms-page-row time { display: block; }
  .cms-slug-field b { display: flex; }
  .cms-settings-grid { grid-template-columns: minmax(0, 1.2fr) minmax(280px, .8fr); }
  .admin-focus-pages > div:last-child { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .admin-focus-pages > div:last-child button:nth-child(odd) { border-right: 1px solid #e3e7e8; }
  .admin-focus-pages > div:last-child button:nth-last-child(-n+2) { border-bottom: 0; }
}

@media (min-width: 1050px) {
  .cms-editor-form { grid-template-columns: minmax(0, 1fr) 310px; align-items: start; }
  .cms-publish-box { position: sticky; top: 22px; }
  .cms-site-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: stretch; }
}

@media (min-width: 700px) {
  .admin-recent-row { grid-template-columns: minmax(180px, 1fr) auto minmax(120px, auto); }
  .admin-recent-row time { grid-column: auto; text-align: right; }
  .admin-system-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (min-width: 900px) {
  .admin-app { display: grid; grid-template-columns: 246px minmax(0, 1fr); }
  .admin-app.is-auth-pending,
  .admin-app.is-login { grid-template-columns: minmax(0, 1fr); }
  .admin-sidebar { position: sticky; top: 0; height: 100svh; padding: 28px 18px 22px; }
  .admin-nav { display: grid; overflow: visible; }
  .admin-nav button { min-width: 0; }
  .admin-sidebar-bottom { display: grid; gap: 11px; margin-top: auto; padding: 20px 8px 4px; border-top: 1px solid rgba(255,255,255,.1); }
  .admin-sidebar-bottom p { display: flex; align-items: center; gap: 9px; margin-bottom: 8px; color: #8f9a9e; font-size: .7rem; }
  .admin-sidebar-bottom a { color: #c7ced1; font-size: .76rem; text-underline-offset: 4px; }
  .admin-sidebar-bottom button { width: 100%; min-height: 38px; padding: 8px 10px; border: 1px solid rgba(255,255,255,.16); background: transparent; color: #c7ced1; cursor: pointer; font: inherit; font-size: .74rem; text-align: left; }
  .admin-sidebar-bottom button:hover { border-color: rgba(255,255,255,.38); color: #fff; }
  .admin-dashboard-grid { grid-template-columns: minmax(0, 1.65fr) minmax(280px, .75fr); }
  .admin-overview { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (max-width: 899px) {
  .admin-sidebar { position: sticky; top: 0; z-index: 30; padding-bottom: 14px; }
  .admin-brand { padding-bottom: 16px; }
  .admin-nav { margin-top: 12px; padding-bottom: 2px; }
  .admin-appbar { min-height: 78px; }
}

@media (max-width: 520px) {
  .admin-nav { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; overflow: visible; }
  .admin-nav button { display: flex; min-width: 0; min-height: 48px; justify-content: center; padding: 9px 6px; text-align: center; }
  .admin-nav button > span { display: none; }
  .admin-nav button > strong { font-size: .67rem; line-height: 1.2; white-space: normal; }
  .admin-nav button > em { position: absolute; top: 3px; right: 3px; min-width: 17px; min-height: 17px; padding-inline: 4px; font-size: .58rem; }
  .admin-appbar { align-items: flex-start; }
  .admin-live { margin-top: 3px; }
  .admin-auth-content { padding-inline: 16px; }
  .admin-view-intro { align-items: flex-start; }
  .admin-view-intro > button { flex: none; }
  .admin-overview { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .admin-overview article { padding: 18px; }
  .admin-card-title { padding-inline: 18px; }
  .admin-recent-row, .admin-shortcuts > a, .admin-shortcuts > button { padding-inline: 18px; }
}
