@font-face { font-family: "Inter"; src: url("/fonts/inter.woff2") format("woff2"); font-weight: 300 600; font-style: normal; font-display: swap; }
@font-face { font-family: "Newsreader"; src: url("/fonts/newsreader-italik.woff2") format("woff2"); font-weight: 200 800; font-style: italic; font-display: swap; }
@font-face { font-family: "Inter Yedek"; src: local("Arial"); size-adjust: 105.9%; ascent-override: 91.4%; descent-override: 22.8%; line-gap-override: 0%; }
@font-face { font-family: "Newsreader Yedek"; font-style: italic; src: local("Georgia Italic"), local("Georgia-Italic"); size-adjust: 89.2%; ascent-override: 82.4%; descent-override: 29.7%; line-gap-override: 0%; }
:root {
color-scheme: light;
--sis: #efeee9;
--kagit: #f7f6f2;
--sis-2: #e6e5de;
--sis-3: #dcdbd2;
--murekkep: #141715;
--arduvaz: #41473f;
--tas: #5f655f;
--cizgi: #cacbc2;
--cizgi-koyu: #9fa39c;
--orman: #17201b;
--orman-2: #1f2924;
--orman-cizgi: #34413a;
--yosun: #a3ada3;
--kestane: #9a4a26;
--kestane-acik: #df9f74;
--sans: "Inter", "Inter Yedek", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
--vurgu: "Newsreader", "Newsreader Yedek", Georgia, "Times New Roman", serif;
--t-dev: clamp(2.75rem, 1.05rem + 6.9vw, 8.25rem);
--t-1: clamp(2rem, 1.25rem + 3.1vw, 4.25rem);
--t-2: clamp(1.5rem, 1.15rem + 1.6vw, 2.5rem);
--t-3: clamp(1.1875rem, 1.05rem + .6vw, 1.5rem);
--t-govde: clamp(1rem, .96rem + .15vw, 1.0625rem);
--sayfa: 1520px;
--kenar: clamp(20px, 4.4vw, 72px);
--aralik: clamp(16px, 2vw, 32px);
--bolum: clamp(80px, 9vw, 144px);
--ust-yuk: 68px;
--egri: cubic-bezier(.2, .7, .1, 1);
--egri-2: cubic-bezier(.65, 0, .35, 1);
}
@media (max-width: 899px) { :root { --ust-yuk: 60px; } }
*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-padding-top: calc(var(--ust-yuk) + 12px); }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }
body {
margin: 0; min-height: 100vh;
background: var(--sis); color: var(--murekkep);
font-family: var(--sans); font-size: var(--t-govde); line-height: 1.6; font-weight: 400;
font-optical-sizing: auto; font-feature-settings: "kern", "calt";
-webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility;
}
img, svg, canvas { display: block; max-width: 100%; }
img { height: auto; }
a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: .22em; }
h1, h2, h3, h4, p, ul, ol, dl, dd, figure, blockquote, fieldset { margin: 0; }
h1, h2, h3, h4 { font-weight: inherit; }
ul, ol { padding: 0; list-style: none; }
fieldset { border: 0; padding: 0; min-width: 0; }
button, input, textarea, select { font: inherit; color: inherit; }
cite { font-style: italic; }
::selection { background: var(--murekkep); color: var(--sis); }
:focus-visible { outline: 1.5px solid var(--kestane); outline-offset: 3px; }
main:focus { outline: none; }
.sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
.sr { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.atla { position: fixed; top: 10px; left: 10px; z-index: 100; padding: 10px 16px; background: var(--murekkep); color: var(--sis); text-decoration: none; transform: translateY(-160%); transition: transform .2s; }
.atla:focus { transform: none; }
.wrap { width: 100%; max-width: var(--sayfa); margin-inline: auto; padding-inline: var(--kenar); }
.ikon { width: 1.05em; height: 1.05em; flex: none; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.vurgu { font-family: var(--vurgu); font-style: italic; font-weight: 340; letter-spacing: -.012em; font-size: 1.07em; line-height: 0; }
.etiket { font-size: .6875rem; line-height: 1.5; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--tas); font-variant-numeric: tabular-nums; }
.giris { font-size: var(--t-3); line-height: 1.42; letter-spacing: -.012em; color: var(--murekkep); text-wrap: pretty; }
.metin { color: var(--arduvaz); max-width: 38em; text-wrap: pretty; }
.nokta { display: inline-block; width: 8px; height: 8px; border-radius: 50%; border: 1.5px solid currentColor; vertical-align: .05em; margin-right: .7em; }
.nokta--dolu { background: currentColor; }
.kot { display: inline-flex; align-items: flex-end; gap: .45em; padding: 0 .35em 3px 0; border-bottom: 1px solid currentColor; font-size: .75rem; font-weight: 500; letter-spacing: .06em; line-height: 1; font-variant-numeric: tabular-nums; text-transform: uppercase; white-space: nowrap; }
.kot__ucgen { width: 11px; height: 9px; margin-bottom: -3px; fill: none; stroke: currentColor; stroke-width: 1.1; }
.dugme {
display: inline-flex; align-items: center; justify-content: center; gap: 14px;
padding: 14px 20px 14px 22px; border: 1px solid var(--murekkep); border-radius: 0;
background: var(--murekkep); color: var(--sis); cursor: pointer;
font-size: .9375rem; font-weight: 500; letter-spacing: -.005em; text-decoration: none; white-space: nowrap;
transition: background-color .35s var(--egri), color .35s var(--egri), border-color .35s var(--egri);
}
.dugme .ikon { transition: transform .45s var(--egri); }
.dugme:hover { background: transparent; color: var(--murekkep); }
.dugme:hover .ikon { transform: translateX(4px); }
.dugme--acik { border-color: var(--sis); background: var(--sis); color: var(--murekkep); }
.dugme--acik:hover { background: transparent; color: var(--sis); }
.dugme--buyuk { padding: 18px 24px 18px 28px; font-size: 1.0625rem; }
.dugme:disabled { opacity: .5; cursor: progress; }
.bag {
display: inline-flex; align-items: center; gap: 10px; padding-bottom: 3px;
font-size: .9375rem; font-weight: 500; letter-spacing: -.005em; text-decoration: none;
background: linear-gradient(currentColor, currentColor) left bottom / 100% 1px no-repeat;
}
.bag:hover { animation: cizgi-gec .75s var(--egri); }
.bag--ok .ikon { transition: transform .4s var(--egri); }
.bag--ok:hover .ikon { transform: translateX(4px); }
@keyframes cizgi-gec {
0% { background-size: 100% 1px; background-position: right bottom; }
45% { background-size: 0 1px; background-position: right bottom; }
55% { background-size: 0 1px; background-position: left bottom; }
100% { background-size: 100% 1px; background-position: left bottom; }
}
.cizgi-yukleyici { display: block; width: 72px; height: 1px; background: linear-gradient(var(--murekkep), var(--murekkep)) 0 0 / 0 100% no-repeat, var(--cizgi); animation: yukleyici 1.2s var(--egri-2) infinite; }
@keyframes yukleyici { 0% { background-size: 0 100%; background-position: 0 0; } 50% { background-size: 100% 100%; background-position: 0 0; } 100% { background-size: 0 100%; background-position: 100% 0; } }
.ust { position: sticky; top: 0; z-index: 50; border-bottom: 1px solid var(--cizgi); view-transition-name: ust; }
.ust::before { content: ""; position: absolute; inset: 0; z-index: -1; background: color-mix(in srgb, var(--sis) 90%, transparent); -webkit-backdrop-filter: blur(14px) saturate(1.1); backdrop-filter: blur(14px) saturate(1.1); }
.ust__ic { display: flex; align-items: center; gap: clamp(16px, 2.6vw, 40px); height: var(--ust-yuk); }
.marka { display: inline-flex; align-items: center; gap: 12px; margin-right: auto; text-decoration: none; }
.logo-isaret { display: block; aspect-ratio: 883 / 1038; color: var(--murekkep); overflow: visible; }
.marka__isaret { width: auto; height: 32px; }
.marka__ad { font-size: .8125rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; white-space: nowrap; }
.menu__liste { display: flex; gap: clamp(18px, 2.2vw, 34px); }
.menu__liste a { position: relative; display: inline-flex; align-items: baseline; gap: 6px; padding-block: 6px; font-size: .875rem; font-weight: 450; text-decoration: none; }
.menu__no { font-size: .625rem; letter-spacing: .06em; color: var(--tas); font-variant-numeric: tabular-nums; }
.menu__liste a::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: currentColor; transform: scaleX(0); transform-origin: right; transition: transform .45s var(--egri); }
.menu__liste a:hover::after, .menu__liste a[aria-current="page"]::after { transform: scaleX(1); transform-origin: left; }
.menu__alt, .menu-dugme { display: none; }
.ust__cta { display: inline-flex; align-items: center; padding: 9px 14px; border: 1px solid var(--murekkep); font-size: .8125rem; font-weight: 500; text-decoration: none; white-space: nowrap; transition: background-color .3s, color .3s; }
.ust__cta:hover { background: var(--murekkep); color: var(--sis); }
@media (max-width: 1099px) { .menu__liste .menu__no { display: none; } }
@media (max-width: 899px) {
.marka__isaret { height: 28px; }
.ust__cta { display: none; }
.menu-dugme {
display: inline-flex; align-items: center; gap: 12px; height: 44px; margin-right: -8px; padding: 0 8px;
background: none; border: 0; cursor: pointer; font-size: .75rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase;
}
.menu-dugme__cizgi { position: relative; flex: none; width: 22px; height: 7px; border-block: 1px solid currentColor; transition: transform .4s var(--egri), height .4s var(--egri); }
.menu-dugme[aria-expanded="true"] .menu-dugme__cizgi { height: 1px; border-bottom: 0; transform: rotate(-12deg); }
.menu {
position: fixed; inset: var(--ust-yuk) 0 0; z-index: 49; display: flex; flex-direction: column; justify-content: space-between;
padding: 24px var(--kenar) calc(28px + env(safe-area-inset-bottom)); background: var(--sis); overflow-y: auto;
visibility: hidden; opacity: 0; transform: translateY(-8px);
transition: opacity .35s var(--egri), transform .45s var(--egri), visibility 0s .45s;
}
.menu[data-acik] { visibility: visible; opacity: 1; transform: none; transition-delay: 0s; }
.menu__liste { flex-direction: column; gap: 0; border-top: 1px solid var(--murekkep); }
.menu__liste li { border-bottom: 1px solid var(--cizgi); }
.menu__liste a { display: flex; gap: 16px; padding: 16px 0; font-size: clamp(1.9rem, 8.5vw, 2.6rem); font-weight: 400; letter-spacing: -.035em; line-height: 1.1; }
.menu__liste .menu__no { display: inline; font-size: .75rem; min-width: 2em; letter-spacing: .06em; }
.menu__liste a::after { display: none; }
.menu__liste a[aria-current="page"] { color: var(--kestane); }
.menu__alt { display: grid; gap: 14px; justify-items: start; padding-top: 28px; }
.menu__konum { font-size: .9375rem; }
.menu__konum span { display: block; font-size: .6875rem; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--tas); }
.menu__eposta { font-size: .9375rem; text-decoration: none; color: var(--arduvaz); }
html[data-menu-acik] { overflow: hidden; }
}
@media (max-width: 479px) {
.menu-dugme__yazi { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.marka { gap: 10px; }
.marka__ad { font-size: .75rem; letter-spacing: .12em; }
}
.acilis { padding-top: clamp(20px, 2.4vw, 32px); padding-bottom: clamp(16px, 2vw, 32px); overflow: hidden; }
.acilis__ust { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--aralik); padding-bottom: 14px; border-bottom: 1px solid var(--cizgi); }
.acilis__ust > :nth-child(1) { grid-column: 1 / 4; }
.acilis__ofis { grid-column: 4 / 10; color: var(--murekkep); }
.acilis__kurulus { grid-column: 10 / -1; text-align: right; }
.acilis__baslik { margin-top: clamp(28px, 4vw, 64px); font-size: var(--t-dev); font-weight: 380; line-height: .96; letter-spacing: -.052em; }
.acilis__baslik .satir { display: block; overflow: hidden; padding-bottom: .06em; margin-bottom: -.06em; }
.acilis__baslik .satir > span { display: inline-block; }
.acilis__baslik .vurgu { font-weight: 330; letter-spacing: -.02em; padding-right: .04em; }
.acilis__giris { max-width: 30em; margin-top: clamp(20px, 2.4vw, 32px); margin-left: calc((100% + var(--aralik)) * 4 / 12); font-size: var(--t-3); line-height: 1.4; letter-spacing: -.012em; color: var(--arduvaz); }
@media (max-width: 899px) {
.acilis__ust { display: flex; flex-wrap: wrap; gap: 4px 16px; }
.acilis__ust > * { grid-column: auto; }
.acilis__kurulus { margin-left: auto; }
.acilis__giris { margin-left: 0; }
}
.ilkeler { margin-top: clamp(32px, 4.4vw, 64px); }
.ilkeler__liste { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: var(--aralik); }
.ilke { display: grid; grid-template-rows: auto 1fr auto; gap: 14px; padding-top: 14px; border-top: 1px solid var(--murekkep); }
.ilke__ad { display: flex; gap: 12px; align-items: baseline; font-size: var(--t-3); letter-spacing: -.02em; }
.ilke__no { font-size: .6875rem; font-weight: 500; letter-spacing: .1em; color: var(--kestane); font-variant-numeric: tabular-nums; }
.ilke__cizim { width: 100%; height: auto; overflow: visible; }
.ilke__metin { padding-top: 12px; border-top: 1px solid var(--cizgi); font-size: .9375rem; color: var(--arduvaz); }
.ik { fill: none; stroke: var(--murekkep); stroke-width: 1.2; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.ik-kalin { stroke-width: 1.8; }
.ik-ince { stroke-width: .9; stroke: var(--tas); }
.ik-insan { stroke-width: 1; }
.ik-kisi { fill: var(--murekkep); stroke-width: .6; }
.ik-kesik { stroke: var(--kestane); stroke-width: 1; stroke-dasharray: 4 4; }
.ik-kesik--soluk { stroke: var(--cizgi-koyu); stroke-dasharray: 2 4; }
.ik-yazi { font-family: var(--sans); font-size: 10.5px; font-weight: 500; letter-spacing: .04em; fill: var(--arduvaz); font-variant-numeric: tabular-nums; }
.ik-yazi--sag { text-anchor: end; }
.ik-yazi--orta { text-anchor: middle; }
.ik-yazi--kucuk { font-size: 9px; fill: var(--tas); }
.ik-yazi--vurgu { fill: var(--kestane); }
.apt-yuz { fill: var(--kagit); stroke: var(--murekkep); stroke-width: 1; vector-effect: non-scaling-stroke; }
.apt-yuz--ticari { fill: var(--sis-2); }
.apt-yuz--cati { fill: var(--sis-3); }
.apt-cam { fill: var(--sis-3); stroke: var(--tas); stroke-width: .7; vector-effect: non-scaling-stroke; }
.apt-isik { fill: var(--kestane-acik); opacity: 0; }
.apt-isik--1, .apt-isik--4 { opacity: .55; }
.apt-kabin { fill: var(--kestane); }
.apt-golge { fill: color-mix(in srgb, var(--murekkep) 22%, transparent); transform-box: view-box; transform: scaleX(.15); }
.apt-golge--sag { transform-origin: 196px 177px; }
.apt-golge--sol { transform-origin: 124px 177px; }
.apt-gunes { transform-box: view-box; transform-origin: 160px 176px; }
.apt-gunes__daire { fill: var(--kestane-acik); stroke: var(--kestane); stroke-width: 1.2; vector-effect: non-scaling-stroke; }
.apt-gece, .apt-yildizlar { opacity: 0; }
.apt-gece__isik { fill: var(--kestane-acik); }
.apt-yildiz { fill: var(--tas); }
@media (max-width: 799px) {
.ilkeler__liste { grid-template-columns: 1fr; row-gap: 20px; }
.ilke { grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); grid-template-rows: auto 1fr; column-gap: 16px; row-gap: 6px; }
.ilke__ad { grid-column: 1; grid-row: 1; }
.ilke__metin { grid-column: 1; grid-row: 2; padding-top: 0; border-top: 0; font-size: .875rem; }
.ilke__cizim { grid-column: 2; grid-row: 1 / 3; align-self: center; }
}
@media (prefers-reduced-motion: no-preference) {
.acilis__baslik .satir > span { transform: translateY(105%); animation: satir-yuksel 1.1s var(--egri) forwards; }
.acilis__baslik .satir:nth-child(2) > span { animation-delay: .12s; }
.acilis__giris, .acilis__ust, .ilke__ad, .ilke__metin, .ik-yazi { opacity: 0; animation: belir 1s var(--egri) .5s forwards; }
.ik { stroke-dasharray: 1; stroke-dashoffset: 1; animation: ciz 1.8s var(--egri-2) .4s forwards; }
.ik-kesik { stroke-dasharray: 4 4; stroke-dashoffset: 0; opacity: 0; animation: belir .8s var(--egri) 1.6s forwards; }
.ik-kesik--soluk { stroke-dasharray: 2 4; }
.ilke--2 .ik:not(.ik-kesik), .ilke--2 .ilke__ad, .ilke--2 .ilke__metin { animation-delay: .65s; }
.ilke--3 .ik:not(.ik-kesik), .ilke--3 .ilke__ad, .ilke--3 .ilke__metin { animation-delay: .9s; }
.ilke .ik-yazi { animation-delay: 1.6s; }
.apt-kat { animation: 10s var(--egri) infinite both; }
.apt-kat--0 { animation-name: apt-kat-0; }
.apt-kat--1 { animation-name: apt-kat-1; }
.apt-kat--2 { animation-name: apt-kat-2; }
.apt-kat--3 { animation-name: apt-kat-3; }
.apt-kat--4 { animation-name: apt-kat-4; }
.apt-kat--5 { animation-name: apt-kat-5; }
.apt-kat--6 { animation-name: apt-kat-6; }
.apt-kat--7 { animation-name: apt-kat-7; }
.apt-asansor { animation: apt-asansor 12s cubic-bezier(.45, 0, .55, 1) infinite; }
.apt-isik { animation: apt-isik 9s ease-in-out infinite; }
.apt-isik--0 { animation-duration: 8s; animation-delay: -2s; }
.apt-isik--1 { animation-duration: 9s; animation-delay: -5s; }
.apt-isik--2 { animation-duration: 7s; animation-delay: -1s; }
.apt-isik--3 { animation-duration: 10s; animation-delay: -7s; }
.apt-isik--4 { animation-duration: 11s; animation-delay: -3s; }
.apt-isik--5 { animation-duration: 8.5s; animation-delay: -6s; }
.apt-isik--6 { animation-duration: 9.5s; animation-delay: -4s; }
.apt-yuruyen { animation: apt-yuruyen 9s linear infinite; }
.apt-gunes { animation: apt-gunes 14s linear infinite; }
.apt-golge--sag { animation: apt-golge-sag 14s linear infinite; }
.apt-golge--sol { animation: apt-golge-sol 14s linear infinite; }
.apt-gece, .apt-yildizlar { animation: apt-gece 14s linear infinite; }
}
@keyframes apt-kat-0 { 0%, 4% { opacity: 0; transform: translateY(-14px); } 8%, 86% { opacity: 1; transform: none; } 94%, 100% { opacity: 0; transform: none; } }
@keyframes apt-kat-1 { 0%, 10% { opacity: 0; transform: translateY(-14px); } 14%, 86% { opacity: 1; transform: none; } 94%, 100% { opacity: 0; transform: none; } }
@keyframes apt-kat-2 { 0%, 16% { opacity: 0; transform: translateY(-14px); } 20%, 86% { opacity: 1; transform: none; } 94%, 100% { opacity: 0; transform: none; } }
@keyframes apt-kat-3 { 0%, 22% { opacity: 0; transform: translateY(-14px); } 26%, 86% { opacity: 1; transform: none; } 94%, 100% { opacity: 0; transform: none; } }
@keyframes apt-kat-4 { 0%, 28% { opacity: 0; transform: translateY(-14px); } 32%, 86% { opacity: 1; transform: none; } 94%, 100% { opacity: 0; transform: none; } }
@keyframes apt-kat-5 { 0%, 34% { opacity: 0; transform: translateY(-14px); } 38%, 86% { opacity: 1; transform: none; } 94%, 100% { opacity: 0; transform: none; } }
@keyframes apt-kat-6 { 0%, 40% { opacity: 0; transform: translateY(-14px); } 44%, 86% { opacity: 1; transform: none; } 94%, 100% { opacity: 0; transform: none; } }
@keyframes apt-kat-7 { 0%, 46% { opacity: 0; transform: translateY(-14px); } 50%, 86% { opacity: 1; transform: none; } 94%, 100% { opacity: 0; transform: none; } }
@keyframes apt-asansor { 0%, 8% { transform: none; } 22%, 32% { transform: translateY(-78px); } 48%, 58% { transform: translateY(-114px); } 72%, 82% { transform: translateY(-42px); } 96%, 100% { transform: none; } }
@keyframes apt-isik { 0%, 30% { opacity: 0; } 38%, 78% { opacity: .55; } 86%, 100% { opacity: 0; } }
@keyframes apt-yuruyen { 0% { opacity: 0; transform: none; } 6% { opacity: 1; } 62% { opacity: 1; transform: translateX(50px); } 68%, 100% { opacity: 0; transform: translateX(50px); } }
@keyframes apt-gunes { 0% { opacity: 0; transform: rotate(-80deg); } 5% { opacity: 1; } 68% { opacity: 1; transform: rotate(80deg); } 73%, 100% { opacity: 0; transform: rotate(80deg); } }
@keyframes apt-golge-sag { 0% { opacity: 0; transform: scaleX(1); } 5% { opacity: 1; transform: scaleX(1); } 36.5% { opacity: 1; transform: scaleX(0); } 100% { opacity: 0; transform: scaleX(0); } }
@keyframes apt-golge-sol { 0%, 36.5% { opacity: 1; transform: scaleX(0); } 68% { opacity: 1; transform: scaleX(1); } 73%, 100% { opacity: 0; transform: scaleX(1); } }
@keyframes apt-gece { 0%, 72% { opacity: 0; } 80%, 94% { opacity: 1; } 100% { opacity: 0; } }
@keyframes satir-yuksel { to { transform: none; } }
@keyframes belir { to { opacity: 1; } }
@keyframes ciz { to { stroke-dashoffset: 0; } }
.bolum { padding-block: var(--bolum); }
.bolum + .bolum:not(.iletisim) { padding-top: 0; }
.bolum[id] { scroll-margin-top: calc(var(--bolum) * -1 + 12px); }
.bolum-bas { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--aralik); padding-top: 16px; border-top: 1px solid var(--murekkep); margin-bottom: clamp(44px, 6vw, 96px); }
.bolum-no { grid-column: 1 / 4; padding-top: .55em; font-size: .6875rem; line-height: 1.5; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--tas); }
.bolum-no span { margin-right: 1.1em; color: var(--kestane); font-variant-numeric: tabular-nums; }
.bolum-baslik { grid-column: 4 / -1; max-width: 17ch; font-size: var(--t-1); font-weight: 400; line-height: 1.02; letter-spacing: -.045em; text-wrap: balance; }
.bolum-giris { max-width: 36em; margin-left: calc((100% + var(--aralik)) * 3 / 12); margin-top: calc(clamp(44px, 6vw, 96px) * -.4); margin-bottom: clamp(48px, 6vw, 88px); }
@media (max-width: 899px) {
.bolum-bas { display: block; }
.bolum-no { padding-top: 0; margin-bottom: 16px; }
.bolum-giris { margin-left: 0; margin-top: 0; }
}
@supports (animation-timeline: view()) {
@media (prefers-reduced-motion: no-preference) {
[data-reveal] { animation: yuksel linear both; animation-timeline: view(); animation-range: entry 0% entry 50%; }
}
}
@keyframes yuksel { from { opacity: 0; transform: translateY(26px); } to { opacity: 1; transform: none; } }
.kimlik { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--aralik); align-items: center; margin-bottom: clamp(56px, 7vw, 104px); }
.kimlik__logo { position: relative; grid-column: 4 / 7; }
.kimlik__isaret { width: 100%; height: auto; }
.kimlik__nokta { position: absolute; width: 44px; height: 44px; margin: -22px 0 0 -22px; padding: 0; border: 0; background: none; border-radius: 50%; cursor: pointer; }
.kimlik__nokta::before { content: ""; position: absolute; inset: 12px; border: 1.5px solid var(--kestane); border-radius: 50%; background: var(--sis); transition: background-color .25s, transform .25s var(--egri); }
.kimlik__nokta:hover::before, .kimlik__nokta:focus-visible::before { transform: scale(1.2); }
.kimlik__nokta[aria-pressed="true"]::before { background: var(--kestane); }
.kimlik__nokta:focus-visible { outline: 2px solid var(--murekkep); outline-offset: -4px; }
@media (prefers-reduced-motion: no-preference) { .kimlik:not(.kimlik--secili) .kimlik__nokta::before { animation: nabiz-halka 2.4s var(--egri) infinite; } }
.kimlik__nokta--atmaca { left: 14%; top: 11%; }
.kimlik__nokta--fidan { left: 84%; top: 14%; }
.kimlik__nokta--erkek { left: 35%; top: 33%; }
.kimlik__nokta--kadin { left: 73%; top: 42%; }
.kimlik__nokta--zemin { left: 15%; top: 93%; }
.kimlik__detay { display: grid; padding-top: 16px; border-top: 1px solid var(--cizgi); min-height: 9.5em; }
.kimlik__detay > * { grid-area: 1 / 1; }
.kimlik__oge { display: grid; gap: 8px; align-content: start; }
.kimlik__oge-ad { display: flex; gap: 10px; align-items: baseline; font-size: var(--t-3); font-weight: 400; letter-spacing: -.02em; color: var(--murekkep); }
.kimlik__oge-no { font-size: .6875rem; font-weight: 500; letter-spacing: .12em; color: var(--kestane); }
@keyframes nabiz-halka { 50% { transform: scale(1.5); opacity: .5; } }
.kimlik__metin { grid-column: 8 / -1; display: grid; gap: 16px; color: var(--arduvaz); }
.kimlik__metin > p:not(.etiket) { max-width: 30em; }
@media (max-width: 1099px) { .kimlik__logo { grid-column: 2 / 7; } }
@media (max-width: 699px) {
.kimlik { display: block; }
.kimlik__logo { max-width: 220px; margin-bottom: 32px; }
}
.kurucu-bag a { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--aralik); align-items: baseline; padding: clamp(18px, 2.2vw, 28px) 0; border-block: 1px solid var(--murekkep); text-decoration: none; }
.kurucu-bag .etiket { grid-column: 1 / 4; }
.kurucu-bag__ad { grid-column: 4 / 8; font-size: var(--t-2); font-weight: 400; letter-spacing: -.04em; line-height: 1.05; }
.kurucu-bag__unvan { grid-column: 8 / 10; font-size: .875rem; color: var(--tas); }
.kurucu-bag__ok { grid-column: 10 / -1; justify-self: end; display: inline-flex; align-items: center; gap: 10px; font-size: .9375rem; font-weight: 500; }
.kurucu-bag__ok .ikon { width: 18px; height: 18px; transition: transform .4s var(--egri); }
.kurucu-bag a:hover .kurucu-bag__ok .ikon { transform: translateX(6px); }
.kurucu-bag a:hover .kurucu-bag__ad { color: var(--kestane); }
@media (max-width: 799px) {
.kurucu-bag a { grid-template-columns: 1fr auto; row-gap: 8px; }
.kurucu-bag .etiket { grid-column: 1 / -1; }
.kurucu-bag__ad { grid-column: 1; }
.kurucu-bag__unvan { grid-column: 1; grid-row: 3; }
.kurucu-bag__ok { grid-column: 2; grid-row: 2 / 4; align-self: center; }
}
.kurucu-portre { margin-bottom: clamp(56px, 7vw, 104px); }
.kurucu-portre__gorsel { aspect-ratio: 3 / 2; overflow: hidden; background: #000; }
.kurucu-portre__gorsel img { width: 100%; height: 100%; object-fit: cover; object-position: 30% 40%; }
.kurucu-portre__alt { display: flex; justify-content: space-between; gap: 12px; padding-top: 10px; margin-top: 12px; border-top: 1px solid var(--murekkep); font-size: .6875rem; font-weight: 500; letter-spacing: .1em; text-transform: uppercase; color: var(--arduvaz); }
@media (max-width: 699px) { .kurucu-portre__gorsel { aspect-ratio: 4 / 5; } .kurucu-portre__gorsel img { object-position: 17% 40%; } }
.sayfa-kurucu .kurucu { padding-bottom: clamp(56px, 7vw, 104px); }
.kurucu-kunye { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--aralik); padding-bottom: clamp(56px, 7vw, 104px); }
.kurucu-kunye > .etiket { grid-column: 1 / 4; }
.kurucu-kunye .kunye { grid-column: 4 / 11; }
.kurucu-kunye .kunye > div { grid-template-columns: 9em 1fr; font-size: .9375rem; }
.kurucu-son, .surec-son { display: grid; gap: 24px; justify-items: start; padding-top: clamp(28px, 3vw, 40px); padding-bottom: var(--bolum); border-top: 1px solid var(--cizgi); }
.kurucu-son__metin, .surec-son__metin { font-size: var(--t-2); letter-spacing: -.04em; line-height: 1.05; }
.kurucu-son__eylem, .surec-son__eylem { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 28px; }
@media (max-width: 799px) { .kurucu-kunye { display: block; } .kurucu-kunye > .etiket { margin-bottom: 14px; } }
.kurucu__bas { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--aralik); align-items: end; padding-top: 16px; border-top: 1px solid var(--murekkep); }
.kurucu__bas .bolum-no { grid-column: 1 / 4; align-self: start; }
.kurucu__bas > div { grid-column: 4 / 8; }
.kurucu__ad { font-size: var(--t-2); font-weight: 400; letter-spacing: -.04em; line-height: 1.05; }
.kurucu__unvan { margin-top: 6px; font-size: .875rem; color: var(--tas); }
.kurucu__slogan { grid-column: 8 / -1; justify-self: end; font-size: var(--t-2); letter-spacing: -.035em; line-height: 1.05; text-align: right; }
.kareler { margin-top: clamp(28px, 4vw, 56px); }
.kare { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--aralik); align-items: baseline; padding: clamp(18px, 2.2vw, 30px) 0; border-bottom: 1px solid var(--cizgi); }
.kare__yer { grid-column: 1 / 4; font-size: .8125rem; font-weight: 500; color: var(--arduvaz); }
.kare__no { display: inline-block; min-width: 2.6em; font-size: .6875rem; letter-spacing: .08em; color: var(--kestane); font-variant-numeric: tabular-nums; }
.kare__cumle { grid-column: 4 / 9; font-size: clamp(1.5rem, 1.05rem + 1.9vw, 2.75rem); font-weight: 350; line-height: 1.08; letter-spacing: -.04em; transition: transform .6s var(--egri); }
.kare:hover .kare__cumle { transform: translateX(10px); }
.kare__not { grid-column: 9 / -1; font-size: .875rem; line-height: 1.55; color: var(--arduvaz); }
.kare__isaret { display: block; margin-bottom: 4px; font-size: .6875rem; font-weight: 500; letter-spacing: .12em; color: var(--kestane); font-variant-numeric: tabular-nums; }
@media (max-width: 899px) {
.kurucu__bas { display: block; }
.kurucu__bas .bolum-no { margin-bottom: 14px; }
.kurucu__slogan { margin-top: 20px; text-align: left; }
.kare { grid-template-columns: 1fr; row-gap: 8px; }
.kare > * { grid-column: 1; }
.kare:hover .kare__cumle { transform: none; }
}
.vitrin { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--aralik); row-gap: 28px; align-items: start; }
.vitrin__medya { position: relative; grid-column: 1 / 9; }
.vitrin__gorsel { position: relative; display: block; aspect-ratio: 16 / 10; overflow: hidden; background: var(--sis-2); }
.vitrin__foto img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.4s var(--egri), opacity .6s var(--egri); view-transition-name: proje-kapak; }
.vitrin__maket { position: absolute; inset: 0; opacity: 0; background: radial-gradient(120% 90% at 50% 40%, var(--kagit), var(--sis) 70%); transition: opacity .6s var(--egri); touch-action: pan-y; }
.vitrin__maket .maket__tuval { position: absolute; inset: 0; width: 100%; height: 100%; cursor: grab; }
.vitrin__maket .maket__tuval:active { cursor: grabbing; }
.vitrin__maket:focus-visible { outline: 2px solid var(--murekkep); outline-offset: -2px; }
.vitrin__ipucu { position: absolute; left: 14px; bottom: 14px; margin: 0; padding: 6px 10px; background: var(--sis); font-size: .6875rem; font-weight: 500; letter-spacing: .1em; text-transform: uppercase; pointer-events: none; transition: opacity .4s; }
.vitrin__ipucu-dokun { display: none; }
.vitrin__3b { position: absolute; top: 12px; right: 12px; display: none; width: 44px; height: 44px; border: 1px solid var(--murekkep); background: var(--sis); font-size: .75rem; font-weight: 600; letter-spacing: .06em; cursor: pointer; }
.vitrin__3b[aria-pressed="true"] { background: var(--murekkep); color: var(--sis); }
@media (hover: hover) and (pointer: fine) {
.vitrin__medya.maket-hazir:hover .vitrin__maket { opacity: 1; }
.vitrin__medya.maket-hazir:not(.vitrin__medya--maket):hover .vitrin__ipucu { opacity: 0; }
.vitrin__medya:not(.maket-hazir):hover .vitrin__foto img { transform: scale(1.02); }
}
@media (hover: none), (pointer: coarse) {
.vitrin__3b { display: grid; place-items: center; }
.vitrin__ipucu { display: none; }
.vitrin__medya.maket-acik .vitrin__maket { opacity: 1; }
.vitrin__medya.maket-acik .vitrin__ipucu { display: block; }
.vitrin__ipucu-fare { display: none; }
.vitrin__ipucu-dokun { display: inline; }
}
.vitrin__medya.maket-oynatildi .vitrin__ipucu { opacity: 0; }
.vitrin__medya.maket-yok .vitrin__ipucu, .vitrin__medya.maket-yok .vitrin__3b { display: none; }
.vitrin__medya--maket .vitrin__maket { opacity: 1; }
.vitrin__yukleniyor { pointer-events: none; }
.vitrin__medya.maket-hazir .vitrin__yukleniyor { opacity: 0; }
@media not ((hover: hover) and (pointer: fine)) {
.vitrin__medya--maket .vitrin__ipucu { display: block; }
}
.levha-bos { position: absolute; inset: 0; display: grid; grid-template-rows: auto minmax(0, 1fr) auto; padding: clamp(14px, 2.2vw, 26px); background-color: var(--kagit); background-image: linear-gradient(to right, var(--izgara) 1px, transparent 1px), linear-gradient(to bottom, var(--izgara) 1px, transparent 1px); background-size: 32px 32px; background-position: center; --izgara: color-mix(in srgb, var(--cizgi) 55%, transparent); }
.levha-bos__no { font-family: var(--vurgu); font-style: italic; font-weight: 340; font-size: clamp(1.75rem, 1rem + 2.4vw, 3rem); line-height: 1; letter-spacing: -.01em; }
.levha-bos .diyagram { place-self: center; width: min(58%, 420px); height: 100%; max-height: 100%; margin: 0; }
.levha-bos__alt { display: flex; justify-content: space-between; gap: 12px; padding-top: 10px; border-top: 1px solid var(--murekkep); font-size: .6875rem; font-weight: 500; letter-spacing: .1em; text-transform: uppercase; color: var(--arduvaz); }
.vitrin__bilgi { grid-column: 9 / -1; display: grid; gap: 18px; align-content: start; }
.vitrin__ad { font-size: var(--t-2); font-weight: 400; letter-spacing: -.04em; line-height: 1.02; }
.vitrin__ozet { font-size: .9375rem; color: var(--arduvaz); }
.vitrin__bilgi .bag { justify-self: start; }
@media (max-width: 999px) { .vitrin__medya, .vitrin__bilgi { grid-column: 1 / -1; } }
.kunye { border-top: 1px solid var(--murekkep); }
.kunye > div { display: grid; grid-template-columns: 7.5em 1fr; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--cizgi); font-size: .875rem; }
.kunye dt { padding-top: .15em; font-size: .6875rem; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--tas); }
.kunye__not { display: block; font-size: .8125rem; color: var(--tas); }
.proje-listesi { border-top: 1px solid var(--murekkep); margin-bottom: clamp(56px, 7vw, 104px); }
.proje-listesi li { border-bottom: 1px solid var(--cizgi); display: grid; grid-template-columns: 5em 3fr 2fr 4em; gap: 16px; align-items: baseline; padding: 18px 0; }
.proje-listesi__no, .proje-listesi__yil { font-size: .8125rem; color: var(--tas); font-variant-numeric: tabular-nums; }
.proje-listesi__ad { font-size: var(--t-3); letter-spacing: -.02em; }
.proje-listesi__tur, .proje-listesi__yer { font-size: .875rem; color: var(--arduvaz); }
.proje-listesi__yil { text-align: right; }
@media (max-width: 699px) {
.proje-listesi li { grid-template-columns: 3.6em 1fr auto; }
.proje-listesi__tur, .proje-listesi__yer { display: none; }
}
.hizmet-panosu { position: relative; }
.hizmet-listesi { border-top: 1px solid var(--murekkep); }
.hizmet { border-bottom: 1px solid var(--cizgi); }
.hizmet__baslik { margin: 0; }
.hizmet__dugme {
position: relative; display: grid; grid-template-columns: 4.2em 1fr auto; align-items: baseline; width: 100%;
padding: clamp(14px, 1.6vw, 22px) 0; background: none; border: 0; cursor: pointer; text-align: left;
}
.hizmet__dugme::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 1px; background: var(--murekkep); transform: scaleX(0); transform-origin: left; transition: transform .7s var(--egri); }
.hizmet__no { font-size: .75rem; font-weight: 500; letter-spacing: .08em; color: var(--tas); font-variant-numeric: tabular-nums; transition: color .3s; }
.hizmet__ad { font-size: clamp(1.4rem, 1rem + 1.8vw, 2.5rem); font-weight: 350; letter-spacing: -.04em; line-height: 1.1; transition: transform .6s var(--egri); }
.hizmet__ok { width: 22px; height: 22px; color: var(--tas); opacity: 0; transform: translateX(-8px); transition: opacity .4s, transform .5s var(--egri); }
.hizmet[data-aktif] .hizmet__dugme::after { transform: scaleX(1); }
.hizmet[data-aktif] .hizmet__no { color: var(--kestane); }
.hizmet[data-aktif] .hizmet__ad { transform: translateX(10px); }
.hizmet[data-aktif] .hizmet__ok { opacity: 1; transform: none; color: var(--murekkep); }
.hizmet__panel { padding: 0 0 22px 4.2em; }
.hizmet__metin { max-width: 26em; font-size: 1rem; color: var(--arduvaz); }
.hizmet__sayac { margin-top: 10px; font-size: .75rem; font-weight: 500; letter-spacing: .08em; color: var(--kestane); font-variant-numeric: tabular-nums; }
.diyagram { width: 100%; max-width: 420px; height: auto; margin-bottom: 20px; color: var(--murekkep); }
.diyagram .d { fill: none; stroke: currentColor; stroke-width: 1.1; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.diyagram .d-kalin { stroke-width: 1.8; }
.diyagram .d-ince { stroke-width: .8; stroke: var(--tas); }
.diyagram .d-kesik { stroke-dasharray: 5 5; stroke: var(--kestane); }
.hizmet-panosu--js .hizmet:not([data-aktif]) .hizmet__panel { display: none; }
@media (min-width: 1000px) {
.hizmet-panosu--js .hizmet-listesi { width: calc((100% + var(--aralik)) * 7 / 12 - var(--aralik)); }
.hizmet-panosu--js .hizmet__panel {
position: absolute; top: 0; right: 0; display: block !important; width: calc((100% + var(--aralik)) * 4 / 12 - var(--aralik));
padding: 18px 0 0; border-top: 1px solid var(--murekkep);
opacity: 0; visibility: hidden; transform: translateY(10px); transition: opacity .45s var(--egri), transform .6s var(--egri), visibility 0s .45s;
}
.hizmet-panosu--js .hizmet[data-aktif] .hizmet__panel { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
.hizmet-panosu--js .hizmet__metin { font-size: 1.125rem; }
}
@media (prefers-reduced-motion: no-preference) {
.hizmet-panosu--js .diyagram .d:not(.d-kesik) { stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset 1.3s var(--egri-2); }
.hizmet-panosu--js .diyagram .d-kesik { opacity: 0; transition: opacity .8s .5s; }
.hizmet-panosu--js .hizmet[data-aktif] .diyagram .d:not(.d-kesik) { stroke-dashoffset: 0; }
.hizmet-panosu--js .hizmet[data-aktif] .diyagram .d-kesik { opacity: 1; }
}
.iletisim { background: var(--orman); color: var(--sis); }
.iletisim ::selection { background: var(--sis); color: var(--orman); }
.iletisim :focus-visible { outline-color: var(--kestane-acik); }
.iletisim .bolum-bas { border-top-color: var(--orman-cizgi); }
.iletisim .bolum-no { color: var(--yosun); }
.iletisim .bolum-no span { color: var(--kestane-acik); }
.iletisim .etiket { color: var(--yosun); }
.iletisim__izgara { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--aralik); row-gap: 56px; }
.iletisim__randevu { grid-column: 1 / 6; display: grid; gap: 28px; justify-items: start; align-content: start; }
.iletisim__giris { max-width: 24em; font-size: var(--t-3); line-height: 1.4; letter-spacing: -.012em; }
.iletisim__konum { grid-column: 6 / 9; }
.iletisim__sehir { margin-top: 10px; font-size: clamp(2.2rem, 1.4rem + 3vw, 4rem); font-weight: 350; line-height: 1; letter-spacing: -.05em; }
.iletisim__adres { margin-top: 10px; font-size: 1.0625rem; }
.iletisim__kanallar { grid-column: 9 / -1; }
.iletisim__eposta { margin-top: 10px; }
.eposta { font-size: clamp(1.05rem, .95rem + .5vw, 1.375rem); letter-spacing: -.02em; text-decoration: none; overflow-wrap: anywhere; background: linear-gradient(currentColor, currentColor) left bottom / 100% 1px no-repeat; padding-bottom: 3px; }
.eposta:hover { animation: cizgi-gec .75s var(--egri); }
.kopyala { margin-top: 14px; padding: 7px 12px; border: 1px solid var(--orman-cizgi); background: none; cursor: pointer; font-size: .75rem; letter-spacing: .06em; color: var(--yosun); transition: color .3s, border-color .3s; }
.kopyala:hover, .kopyala[data-tamam] { color: var(--sis); border-color: var(--yosun); }
.sosyal { margin-top: 28px; border-top: 1px solid var(--orman-cizgi); }
.sosyal li { border-bottom: 1px solid var(--orman-cizgi); }
.sosyal__bag { display: grid; grid-template-columns: 26px 1fr auto auto; align-items: center; gap: 12px; padding: 14px 0; text-decoration: none; font-size: .9375rem; }
.sosyal__bag > .ikon:first-child { width: 18px; height: 18px; color: var(--yosun); }
.sosyal__kulp { font-size: .8125rem; color: var(--yosun); }
.sosyal__ok { transition: transform .4s var(--egri), color .3s; }
.sosyal__bag:hover .sosyal__ok { transform: translate(3px, -3px); color: var(--kestane-acik); }
@media (max-width: 999px) {
.iletisim__randevu { grid-column: 1 / -1; }
.iletisim__konum { grid-column: 1 / 7; }
.iletisim__kanallar { grid-column: 7 / -1; }
}
@media (max-width: 599px) { .iletisim__konum, .iletisim__kanallar { grid-column: 1 / -1; } }
.surec-bag .bolum-bas { margin-bottom: 0; }
.surec-bag .bolum-baslik { max-width: none; }
.surec-bag__bag { display: inline; text-decoration: none; }
.surec-bag__ok { display: inline-block; width: .8em; height: .8em; margin-left: .3em; vertical-align: -.02em; stroke-width: 1.25; transition: transform .45s var(--egri); }
.surec-bag__bag:hover { color: var(--kestane); }
.surec-bag__bag:hover .surec-bag__ok { transform: translateX(8px); }
.surec-bag .film { margin-top: clamp(32px, 4vw, 56px); }
.antet { padding-top: clamp(40px, 5vw, 72px); font-size: .875rem; }
.antet a { text-decoration: none; transition: color .3s; }
.antet a:hover { color: var(--kestane); }
.antet__tablo { display: grid; grid-template-columns: minmax(180px, 1fr) 3.2fr; gap: 1px; background: var(--cizgi-koyu); border: 1px solid var(--cizgi-koyu); }
.antet__logo { display: grid; place-content: center; justify-items: center; gap: 14px; padding: clamp(20px, 2.6vw, 36px); background: var(--sis); }
.antet__isaret { width: auto; height: clamp(84px, 7vw, 112px); }
.antet__marka { font-size: .75rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; text-align: center; }
.antet__alanlar { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; margin: 0; }
.antet__alan { padding: 12px 16px 14px; background: var(--sis); }
.antet__alan--genis { grid-column: span 2; }
.antet__alan dt { margin-bottom: 6px; font-size: .625rem; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; color: var(--tas); }
.antet__alan dd { overflow-wrap: anywhere; }
.antet__alan--vurgu dd { font-size: 1.0625rem; font-weight: 500; letter-spacing: -.01em; }
.antet__sosyal { display: flex; flex-wrap: wrap; gap: 6px 18px; }
.antet__sosyal a { display: inline-flex; align-items: center; gap: 8px; }
.antet__sosyal .ikon { width: 15px; height: 15px; color: var(--tas); }
.antet__son { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 28px; padding: 18px 0 calc(28px + env(safe-area-inset-bottom)); font-size: .8125rem; color: var(--tas); }
.antet__son p { margin-right: auto; }
.antet__basa { display: inline-flex; align-items: center; gap: 8px; }
@media (max-width: 899px) {
.antet__tablo { grid-template-columns: 1fr; }
.antet__alanlar { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.antet__logo { grid-auto-flow: column; justify-content: start; align-items: center; gap: 16px; }
.antet__isaret { height: 64px; }
}
.sayfa-bas { padding-top: clamp(40px, 6vw, 96px); padding-bottom: clamp(40px, 5vw, 72px); }
.sayfa-bas > .bolum-no { display: block; padding: 0 0 16px; margin-bottom: clamp(28px, 4vw, 56px); border-bottom: 1px solid var(--murekkep); }
.sayfa-bas__baslik { max-width: 14ch; font-size: clamp(2.75rem, 1.2rem + 5.8vw, 7.25rem); font-weight: 380; line-height: .96; letter-spacing: -.052em; text-wrap: balance; }
.sayfa-bas__giris { max-width: 30em; margin-top: clamp(20px, 2.6vw, 36px); margin-left: calc((100% + var(--aralik)) * 5 / 12); font-size: var(--t-3); line-height: 1.4; letter-spacing: -.012em; color: var(--arduvaz); text-wrap: pretty; }
@media (max-width: 699px) { .sayfa-bas__giris { margin-left: 0; } }
.iz { padding-bottom: 16px; margin-bottom: clamp(28px, 4vw, 56px); border-bottom: 1px solid var(--murekkep); font-size: .6875rem; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--tas); }
.iz a { text-decoration: none; color: var(--kestane); }
.iz a:hover { text-decoration: underline; }
.proje-dizini { padding-bottom: var(--bolum); }
.proje-dizini .vitrin + .vitrin { margin-top: clamp(56px, 7vw, 104px); padding-top: clamp(28px, 3.5vw, 48px); border-top: 1px solid var(--cizgi); }
.vaka__bas { padding-top: clamp(32px, 5vw, 80px); padding-bottom: clamp(32px, 4vw, 56px); }
.vaka__baslik { font-size: clamp(3rem, 1.1rem + 7.2vw, 9rem); font-weight: 380; line-height: .92; letter-spacing: -.055em; }
.vaka__tam-ad { margin-top: 16px; font-size: var(--t-3); color: var(--arduvaz); letter-spacing: -.012em; }
.vaka__meta { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: clamp(28px, 4vw, 56px); border-top: 1px solid var(--murekkep); }
.vaka__meta > div { padding: 12px 16px 0 0; }
.vaka__meta > div + div { padding-left: 16px; border-left: 1px solid var(--cizgi); }
.vaka__meta dt { font-size: .6875rem; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--tas); }
.vaka__meta dd { margin-top: 6px; font-size: 1rem; }
@media (max-width: 799px) { .vaka__meta { grid-template-columns: 1fr 1fr; } .vaka__meta > div:nth-child(3) { padding-left: 0; border-left: 0; } .vaka__meta > div { padding-bottom: 12px; border-bottom: 1px solid var(--cizgi); } }
.vaka__kapak { margin-bottom: clamp(56px, 7vw, 112px); }
.vaka__kapak-gorsel { max-height: 88vh; overflow: hidden; background: var(--sis-2); }
.vaka__kapak img { width: 100%; height: auto; max-height: 88vh; object-fit: cover; object-position: 50% 78%; view-transition-name: proje-kapak; }
.vaka__kapak .levha__alt { margin-top: 12px; }
.levha__alt { display: flex; gap: .9em; font-size: .8125rem; line-height: 1.5; color: var(--tas); }
.sekil-no { flex: none; padding-top: .1em; font-size: .6875rem; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--kestane); font-variant-numeric: tabular-nums; }
.vaka__ozet { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--aralik); row-gap: 40px; margin-bottom: var(--bolum); }
.vaka__metin { grid-column: 1 / 8; display: grid; gap: 1.1em; align-content: start; }
.vaka__ozet .kunye { grid-column: 9 / -1; }
@media (max-width: 999px) { .vaka__metin, .vaka__ozet .kunye { grid-column: 1 / -1; } }
.vaka__maket { margin-bottom: var(--bolum); }
.maket { margin: 0; }
.maket__sahne { position: relative; aspect-ratio: 16 / 9; overflow: hidden; background: radial-gradient(120% 90% at 50% 40%, var(--kagit), var(--sis) 70%); border: 1px solid var(--cizgi); cursor: grab; touch-action: pan-y; }
.maket__sahne:active { cursor: grabbing; }
.maket__sahne:focus-visible { outline-offset: -3px; }
.maket__tuval { position: absolute; inset: 0; width: 100%; height: 100%; }
.maket__yukleniyor { position: absolute; inset: 0; display: grid; place-content: center; justify-items: center; gap: 14px; font-size: .75rem; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--tas); transition: opacity .5s; }
.maket-yok .maket__yukleniyor .cizgi-yukleyici { display: none; }
.maket__uyari { position: absolute; left: 50%; bottom: 16px; transform: translateX(-50%); margin: 0; padding: 8px 12px; background: var(--murekkep); color: var(--sis); font-size: .8125rem; pointer-events: none; text-align: center; max-width: calc(100% - 32px); }
.maket__arac { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px 24px; padding: 10px 0 14px; border-bottom: 1px solid var(--cizgi); }
.maket__gorunumler, .maket__kontroller { display: flex; flex-wrap: wrap; gap: 4px; }
.maket__arac button { min-height: 36px; padding: 6px 12px; border: 1px solid transparent; background: none; cursor: pointer; font-size: .8125rem; font-weight: 500; color: var(--arduvaz); transition: border-color .3s, background-color .3s, color .3s; }
.maket__arac button:hover { border-color: var(--cizgi-koyu); color: var(--murekkep); }
.maket__arac button[aria-pressed="true"] { border-color: var(--murekkep); color: var(--murekkep); }
.maket__kontroller button { min-width: 36px; }
.maket .levha__alt { margin-top: 12px; }
.maket--tam { background: var(--sis); display: flex; flex-direction: column; padding: 12px; }
.maket--tam .maket__sahne { flex: 1; aspect-ratio: auto; touch-action: none; }
@media (max-width: 699px) { .maket__sahne { aspect-ratio: 4 / 5; } }
.vaka__okuma { margin-bottom: var(--bolum); }
.okuma { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid var(--murekkep); margin-bottom: clamp(48px, 6vw, 88px); }
.okuma__oge { padding: 18px clamp(12px, 1.6vw, 24px) 0 0; }
.okuma__oge + .okuma__oge { padding-left: clamp(12px, 1.6vw, 24px); border-left: 1px solid var(--cizgi); }
.okuma__no { font-size: .6875rem; font-weight: 500; letter-spacing: .1em; color: var(--kestane); }
.okuma__oge h3 { margin: 12px 0 8px; font-size: var(--t-3); font-weight: 450; letter-spacing: -.02em; }
.okuma__oge p { font-size: .9375rem; color: var(--arduvaz); }
@media (max-width: 899px) { .okuma { grid-template-columns: 1fr 1fr; row-gap: 28px; } .okuma__oge:nth-child(3) { padding-left: 0; border-left: 0; } }
@media (max-width: 499px) { .okuma { grid-template-columns: 1fr; } .okuma__oge + .okuma__oge { padding-left: 0; border-left: 0; border-top: 1px solid var(--cizgi); padding-top: 16px; } }
.gorunus { margin: 0; }
.gorunus__svg { width: 100%; height: auto; }
.gorunus__cizgi { fill: none; stroke: var(--murekkep); stroke-width: 1.1; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.gorunus__dolgu { fill: var(--sis); }
.gorunus__gozdolma { fill: url(#gozdolma); }
.gorunus__cati { fill: url(#kiremit); }
.gorunus__tas { fill: var(--sis-2); }
.gorunus__ahsap { fill: var(--murekkep); }
.gorunus__cam { fill: var(--sis-3); }
.gorunus__cerceve { fill: var(--sis); }
.gorunus__kayit { stroke-width: .7; }
.gorunus__zemin { stroke-width: 2.2; }
.gorunus__arka-zemin { stroke: var(--tas); stroke-dasharray: 6 5; }
.gorunus__desen { fill: none; stroke: var(--cizgi-koyu); stroke-width: .7; }
.gorunus__toprak { fill: url(#toprak); opacity: .6; }
.gorunus__kot { fill: none; stroke: var(--kestane); stroke-width: 1; }
.gorunus__etiket { font-family: var(--sans); font-size: 13px; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; fill: var(--kestane); }
.gorunus .levha__alt { margin-top: 12px; }
@media (max-width: 699px) { .gorunus__kotlar { display: none; } }
@supports (animation-timeline: view()) {
@media (prefers-reduced-motion: no-preference) {
.gorunus__cizgi { stroke-dasharray: 1; stroke-dashoffset: 1; animation: ciz linear both; animation-timeline: view(); }
.gorunus__dolgu { fill-opacity: 0; animation: ciz linear both, dolgu linear both; animation-timeline: view(), view(); }
.gorunus__grup--1 .gorunus__cizgi { animation-range: entry 10% cover 30%; }
.gorunus__grup--2 .gorunus__cizgi { animation-range: entry 20% cover 38%; }
.gorunus__grup--3 .gorunus__cizgi { animation-range: entry 30% cover 44%; }
.gorunus__grup--4 .gorunus__cizgi { animation-range: entry 40% cover 50%; }
.gorunus__grup--5 .gorunus__cizgi { animation-range: entry 0% cover 30%; }
}
}
@keyframes dolgu { to { fill-opacity: 1; } }
.vaka__galeri { margin-bottom: var(--bolum); }
.galeri { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); grid-auto-flow: dense; gap: clamp(28px, 3vw, 48px) var(--aralik); }
.galeri__oge { grid-column: span 6; }
.galeri__oge--genis { grid-column: 1 / -1; }
.galeri__bag { display: block; overflow: hidden; background: var(--sis-2); cursor: zoom-in; }
.galeri__oge--normal .galeri__bag, .galeri__oge--dik .galeri__bag { aspect-ratio: 3 / 2; }
.galeri__oge--genis .galeri__bag { aspect-ratio: 2 / 1; }
.galeri__bag img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--egri); }
.galeri__bag:hover img { transform: scale(1.02); }
.galeri .levha__alt { margin-top: 10px; }
@media (max-width: 699px) { .galeri__oge { grid-column: 1 / -1; } }
.isik-kutusu { width: 100vw; max-width: none; height: 100dvh; max-height: none; margin: 0; padding: clamp(16px, 3vw, 40px); border: 0; background: rgba(16, 19, 17, .96); color: var(--sis); }
.isik-kutusu::backdrop { background: rgba(16, 19, 17, .6); }
.isik-kutusu[open] { display: grid; place-items: center; }
.isik-kutusu__figur { display: grid; gap: 12px; justify-items: center; max-width: 100%; }
.isik-kutusu__figur img { max-width: min(100%, 1400px); max-height: calc(100dvh - 140px); width: auto; height: auto; object-fit: contain; }
.isik-kutusu__figur figcaption { font-size: .8125rem; color: var(--yosun); text-align: center; }
.isik-kutusu button { position: absolute; display: grid; place-items: center; width: 48px; height: 48px; border: 1px solid var(--orman-cizgi); background: rgba(16, 19, 17, .7); color: var(--sis); cursor: pointer; font-size: 1.125rem; }
.isik-kutusu button:hover { border-color: var(--sis); }
.isik-kutusu__kapat { top: 16px; right: 16px; }
.isik-kutusu__onceki { left: 16px; top: 50%; transform: translateY(-50%); }
.isik-kutusu__sonraki { right: 16px; top: 50%; transform: translateY(-50%); }
.isik-kutusu__sayac { position: absolute; left: 20px; top: 26px; margin: 0; font-size: .75rem; letter-spacing: .1em; color: var(--yosun); font-variant-numeric: tabular-nums; }
.proje__gezinti { display: grid; grid-template-columns: 1fr auto 1fr; align-items: end; gap: 24px; padding-top: 24px; padding-bottom: var(--bolum); }
.proje__gezinti::before { content: ""; grid-column: 1 / -1; height: 1px; margin-bottom: 8px; background: var(--murekkep); }
.proje__onceki, .proje__sonraki { display: grid; gap: 6px; font-size: var(--t-3); letter-spacing: -.02em; text-decoration: none; }
.proje__sonraki { text-align: right; }
.bant { background: var(--orman); color: var(--sis); }
.bant__ic { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 28px 48px; padding-block: clamp(64px, 8vw, 128px); }
.bant__baslik { max-width: 14ch; font-size: var(--t-1); font-weight: 400; line-height: 1.02; letter-spacing: -.045em; }
.bant__eylem { display: grid; gap: 14px; justify-items: start; }
.bant__not { font-size: .8125rem; color: var(--yosun); }
.bant :focus-visible { outline-color: var(--kestane-acik); }
.sayfa-surec { --e-tasarim: #38895a; --e-ruhsat: #c8892f; --e-santiye: #2d63a0; --e-teslim: #9c4824; }
.e-tasarim { --e: var(--e-tasarim); }
.e-ruhsat { --e: var(--e-ruhsat); }
.e-santiye { --e: var(--e-santiye); }
.e-teslim { --e: var(--e-teslim); }
.surec-bas__alt { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--aralik); row-gap: 36px; align-items: start; margin-top: clamp(20px, 2.6vw, 36px); }
.surec-bas__alt .sayfa-bas__giris { grid-column: 6 / -1; grid-row: 1; margin: 0; }
.ornek { grid-column: 1 / 5; grid-row: 1; margin: 0; }
.ornek__bas { padding-bottom: 10px; margin-bottom: 12px; border-bottom: 1px solid var(--cizgi); }
.ornek__kesit { display: grid; gap: 3px; }
.ornek__grup { display: grid; grid-template-columns: minmax(0, 1fr) 7.5em; column-gap: 12px; }
.ornek__grup--otopark { margin-top: 2px; padding-top: 5px; border-top: 2px solid var(--murekkep); }
.ornek__katlar { display: grid; gap: 3px; }
.ornek__kat { display: grid; grid-template-columns: 4.6em minmax(0, 1fr); gap: 10px; align-items: center; font-size: .6875rem; color: var(--tas); font-variant-numeric: tabular-nums; }
.ornek__bar { height: 13px; background: var(--kagit); box-shadow: inset 0 0 0 1px var(--murekkep); }
.ornek__kat--cati .ornek__bar { margin-inline: 4%; background: var(--sis-3); box-shadow: none; clip-path: polygon(6% 0, 94% 0, 100% 100%, 0 100%); }
.ornek__grup--ticari .ornek__bar { background: var(--arduvaz); box-shadow: none; }
.ornek__grup--otopark .ornek__bar { background: repeating-linear-gradient(45deg, var(--cizgi-koyu) 0 1px, transparent 1px 5px); box-shadow: inset 0 0 0 1px var(--cizgi-koyu); }
.ornek__kullanim { display: flex; align-items: center; padding-left: 10px; border-left: 1px solid var(--murekkep); font-size: .8125rem; line-height: 1.3; }
.ornek__grup--otopark .ornek__kullanim { color: var(--tas); border-left-color: var(--cizgi-koyu); }
@media (max-width: 899px) {
.surec-bas__alt .sayfa-bas__giris { grid-column: 1 / -1; }
.ornek { grid-column: 1 / -1; grid-row: 2; max-width: 420px; }
}
.cipler { display: flex; flex-wrap: wrap; gap: 6px; }
.cipler li { padding: 3px 10px 4px; border: 1px solid var(--cizgi-koyu); font-size: .8125rem; line-height: 1.4; }
.cizelge { margin: 0; }
.anahtar { display: flex; flex-wrap: wrap; gap: 8px 22px; margin-bottom: 22px; font-size: .8125rem; color: var(--arduvaz); }
.anahtar li { display: inline-flex; align-items: center; gap: 8px; }
.anahtar__sure { color: var(--tas); font-variant-numeric: tabular-nums; }
.anahtar__renk { width: 12px; height: 12px; border-radius: 3px; background: var(--e); }
.anahtar__tas { width: 9px; height: 9px; margin-inline: 1.5px; background: var(--murekkep); transform: rotate(45deg); }
.anahtar__kazma { width: 0; height: 14px; border-left: 1px dashed var(--kestane); margin-inline: 6px; }
.cizelge__tablo { width: 100%; table-layout: fixed; border-collapse: collapse; font-size: .8125rem; }
.cizelge__no-sutun { width: 2.75em; }
.cizelge__blok { border-left: 1px solid var(--cizgi); }
.cizelge__blok--kazma { border-left: 1px dashed var(--kestane); }
.cizelge__tablo thead th { position: relative; padding: 0 0 10px 6px; font-size: .6875rem; font-weight: 500; letter-spacing: .06em; color: var(--tas); text-align: left; font-variant-numeric: tabular-nums; }
.cizelge__tablo thead th:first-child { padding-left: 0; text-transform: uppercase; letter-spacing: .12em; }
.cizelge__son { position: absolute; right: 0; bottom: 10px; }
.cizelge__tablo tbody tr { --zemin: var(--sis); }
.cizelge__tablo tbody tr:hover { --zemin: var(--sis-2); background: var(--zemin); }
.cizelge__tablo td { position: relative; height: 34px; padding: 0; }
.cizelge__no { font-size: .6875rem; color: var(--tas); font-variant-numeric: tabular-nums; }
.cizelge__cubuk { position: relative; display: block; height: 12px; margin-inline: 1px; border-radius: 3px; background: var(--e); }
.cizelge__satir--tas .cizelge__cubuk::after { content: ""; position: absolute; right: -6px; top: 50%; width: 9px; height: 9px; margin-top: -4.5px; background: var(--murekkep); box-shadow: 0 0 0 2px var(--zemin); transform: rotate(45deg); }
.cizelge__etiket { position: absolute; top: 50%; display: inline-flex; align-items: baseline; gap: .6em; padding: 1px 4px; transform: translateY(-50%); background: var(--zemin); white-space: nowrap; }
.cizelge__bos--sag .cizelge__etiket { left: 6px; }
.cizelge__satir--tas .cizelge__bos--sag .cizelge__etiket { left: 12px; }
.cizelge__bos--sol .cizelge__etiket { right: 6px; }
.cizelge__etiket a { font-weight: 450; text-decoration: none; }
.cizelge__etiket a:hover { text-decoration: underline; }
.cizelge__sure { font-size: .75rem; color: var(--tas); font-variant-numeric: tabular-nums; }
.cizelge .levha__alt { margin-top: 18px; padding-top: 12px; border-top: 1px solid var(--cizgi); }
@media (max-width: 699px) {
.cizelge__tablo { font-size: .75rem; }
.cizelge__no-sutun { width: 2em; }
.cizelge__tablo td { height: 30px; }
.cizelge__cubuk { height: 10px; border-radius: 2px; }
.cizelge__tablo thead th { padding-left: 3px; }
}
.surec-adimlar { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--aralik); align-items: start; }
.santiye { grid-column: 1 / 7; position: sticky; top: calc(var(--ust-yuk) + 20px); display: grid; gap: 12px; margin: 0; }
.santiye__bas { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding-top: 14px; border-top: 1px solid var(--murekkep); }
.santiye__ay { display: flex; align-items: baseline; gap: 8px; }
.santiye__sayi { font-size: var(--t-2); font-weight: 350; line-height: 1; letter-spacing: -.05em; font-variant-numeric: tabular-nums; }
.santiye__toplam { font-size: .875rem; color: var(--tas); font-variant-numeric: tabular-nums; }
.santiye__ad { display: flex; gap: 10px; align-items: baseline; font-size: 1.0625rem; letter-spacing: -.01em; text-align: right; }
.santiye__no { font-size: .6875rem; font-weight: 500; letter-spacing: .08em; color: var(--kestane); font-variant-numeric: tabular-nums; }
.santiye__svg { width: auto; height: min(calc(100svh - var(--ust-yuk) - 170px), 720px); max-width: 100%; margin-inline: auto; overflow: visible; }
.santiye__cubuk { width: 100%; height: 4px; }
.santiye__cubuk-iz { fill: var(--sis-3); }
.santiye__cubuk-dolu { fill: var(--murekkep); transition: width .6s var(--egri); }
.santiye[data-evre="tasarim"] .santiye__cubuk-dolu { fill: var(--e-tasarim); }
.santiye[data-evre="ruhsat"] .santiye__cubuk-dolu { fill: var(--e-ruhsat); }
.santiye[data-evre="santiye"] .santiye__cubuk-dolu { fill: var(--e-santiye); }
.santiye[data-evre="teslim"] .santiye__cubuk-dolu { fill: var(--e-teslim); }
.santiye__svg .sc { transition: opacity .55s var(--egri); }
.santiye:not(.santiye--canli) .sc[data-son] { display: none; }
.santiye--canli .sc { opacity: 0; }
.santiye--canli .sc.acik { opacity: 1; }
@media (prefers-reduced-motion: no-preference) {
.santiye--canli .sc-kat { transition-duration: .4s; }
.santiye--canli .sc-kat--1 { transition-delay: .08s; }
.santiye--canli .sc-kat--2 { transition-delay: .16s; }
.santiye--canli .sc-kat--3 { transition-delay: .24s; }
.santiye--canli .sc-kat--4 { transition-delay: .32s; }
.santiye--canli .sc-kat--5 { transition-delay: .4s; }
.santiye--canli .sc-kat--6 { transition-delay: .48s; }
}
.santiye__svg path, .santiye__svg rect, .santiye__svg circle { vector-effect: non-scaling-stroke; }
.santiye__svg .sc-desen { fill: none; stroke: var(--cizgi-koyu); stroke-width: .7; vector-effect: none; }
.sc-toprak { fill: url(#sc-desen-toprak); }
.sc-zemin { fill: none; stroke: var(--murekkep); stroke-width: 2; }
.sc-cizgi { fill: none; stroke: var(--murekkep); stroke-width: 1.2; stroke-linejoin: round; stroke-linecap: round; }
.sc-ince-cizgi { stroke-width: .8; }
.sc-zarf { fill: none; stroke: var(--kestane); stroke-width: 1.2; stroke-dasharray: 6 4; }
.sc-zarf--ince { stroke-width: .8; stroke-dasharray: 2 3; }
.sc-sondaj { fill: none; stroke: var(--kestane); stroke-width: 1.4; stroke-dasharray: 4 3; }
.sc-uc { fill: var(--sis); stroke: var(--murekkep); stroke-width: 1; }
.sc-bosluk { fill: var(--sis); }
.sc-kazik { fill: none; stroke: var(--murekkep); stroke-width: 3.5; }
.sc-taslak { fill: none; stroke: var(--kestane); stroke-width: 1; stroke-dasharray: 5 4; }
.sc-aks-cizgi { fill: none; stroke: var(--cizgi-koyu); stroke-width: .8; stroke-dasharray: 10 3 2 3; }
.sc-aks-balon { fill: var(--sis); stroke: var(--tas); stroke-width: .8; }
.sc-grobeton { fill: var(--tas); }
.sc-beton { fill: url(#sc-desen-beton); stroke: var(--murekkep); stroke-width: 1; }
.sc-yalitim { fill: none; stroke: var(--kestane); stroke-width: 1.6; }
.sc-duvar { fill: url(#sc-desen-tugla); }
.sc-karkas { fill: var(--murekkep); }
.sc-cati-zemin { fill: var(--sis-2); }
.sc-cati-desen { fill: url(#sc-desen-kiremit); }
.sc-tesisat-su { fill: none; stroke: var(--e-santiye); stroke-width: 1.4; }
.sc-tesisat-el { fill: none; stroke: var(--kestane); stroke-width: 1.4; stroke-dasharray: 5 2 1 2; }
.sc-cephe-yuz { fill: var(--kagit); stroke: var(--murekkep); stroke-width: 1.6; }
.sc-subasman { fill: var(--sis-3); }
.sc-ticari-yuz { fill: var(--sis-2); stroke: var(--murekkep); stroke-width: 1.6; }
.sc-tente { fill: var(--kestane-acik); stroke: var(--kestane); stroke-width: .8; }
.sc-cam { fill: var(--sis-3); }
.sc-isik { fill: var(--kestane-acik); }
.sc-iskele-cizgi { fill: none; stroke: var(--tas); stroke-width: .8; }
.sc-detay-zemin { fill: var(--sis); }
.sc-detay-cerceve { fill: none; stroke: var(--kestane); stroke-width: 1.2; }
.sc-yalitim-dolgu { fill: url(#sc-desen-yalitim); }
.sc-sap { fill: var(--sis-2); }
.sc-boya { fill: none; stroke: var(--kestane); stroke-width: 1.4; }
.sc-agac { fill: color-mix(in srgb, var(--e-tasarim) 16%, var(--sis)); stroke: var(--tas); stroke-width: .8; }
.sc-muhur { fill: none; stroke: var(--kestane); stroke-width: 1.4; }
.sc-muhur--ic { stroke-width: .8; }
.sc-muhur-yazi { font-family: var(--sans); font-size: 9px; font-weight: 600; letter-spacing: .12em; text-anchor: middle; fill: var(--kestane); }
.sc-yazi { font-family: var(--sans); font-size: 11px; font-weight: 500; letter-spacing: .04em; fill: var(--arduvaz); paint-order: stroke; stroke: var(--sis); stroke-width: 3px; stroke-linejoin: round; vector-effect: none; }
.sc-yazi--kucuk { font-size: 9.5px; }
.sc-yazi--orta { text-anchor: middle; }
.sc-yazi--sag { text-anchor: end; }
.sc-yazi--kestane { fill: var(--kestane); }
.asama-listesi { grid-column: 7 / -1; }
.asama { padding: 28px 0 36px; border-top: 1px solid var(--cizgi); scroll-margin-top: 30vh; transition: opacity .45s var(--egri); }
.asama:first-child { border-top-color: var(--murekkep); }
.asama__bas { display: grid; grid-template-columns: 3em 1fr auto; column-gap: 12px; align-items: baseline; }
.asama__no { font-size: .75rem; font-weight: 500; letter-spacing: .08em; color: var(--kestane); font-variant-numeric: tabular-nums; }
.asama__ad { font-size: var(--t-2); font-weight: 400; line-height: 1.05; letter-spacing: -.04em; }
.asama__sure { font-size: .875rem; color: var(--tas); white-space: nowrap; }
.asama__sure-sayi { font-size: var(--t-3); letter-spacing: -.02em; color: var(--murekkep); font-variant-numeric: tabular-nums; }
.asama__zaman, .asama__not, .asama__bilgi, .dongu, .asama__alt { margin-left: calc(3em + 12px); }
.asama__zaman { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 14px; align-items: center; margin-top: 16px; }
.asama__zaman-svg { width: 100%; height: 6px; }
.zaman__iz { fill: var(--sis-3); }
.zaman__cubuk { fill: var(--e); }
.asama__ay { font-size: .75rem; color: var(--tas); white-space: nowrap; font-variant-numeric: tabular-nums; }
.asama__not { max-width: 32em; margin-top: 14px; color: var(--arduvaz); text-wrap: pretty; }
.asama__bilgi { display: grid; gap: 12px; margin-top: 20px; }
.asama__bilgi > div { display: grid; grid-template-columns: 4.5em minmax(0, 1fr); gap: 12px; align-items: baseline; }
.asama__bilgi dt { font-size: .6875rem; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--tas); }
.belgeler { display: flex; flex-wrap: wrap; gap: 6px 18px; font-size: .875rem; }
.belgeler li { display: inline-flex; align-items: center; gap: 6px; }
.belgeler .ikon { color: var(--kestane); }
.asama__kim { display: flex; flex-wrap: wrap; gap: 2px 16px; font-size: .875rem; color: var(--arduvaz); }
.asama__yurutur { font-weight: 600; color: var(--murekkep); }
.asama__tas { display: inline-flex; align-items: center; gap: 10px; padding: 7px 12px 7px 11px; background: var(--murekkep); color: var(--sis); font-size: .6875rem; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; }
.asama__tas-isaret { width: 8px; height: 8px; background: var(--kestane-acik); transform: rotate(45deg); }
.dongu { margin-top: 22px; }
.dongu__svg { width: min(100%, 280px); height: auto; overflow: visible; }
.dongu__halka { fill: none; stroke: var(--cizgi-koyu); stroke-width: 1; }
.dongu__dugum { fill: var(--e-santiye); stroke: var(--sis); stroke-width: 2; }
.dongu__ok { fill: var(--tas); }
.dongu__yazi { font-family: var(--sans); font-size: 11.5px; font-weight: 500; fill: var(--murekkep); }
.dongu__sure { font-family: var(--sans); font-size: 17px; font-weight: 400; letter-spacing: -.02em; fill: var(--murekkep); }
.dongu__birim { font-family: var(--sans); font-size: 9.5px; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; fill: var(--tas); }
@media (min-width: 1000px) {
.surec-adimlar--canli .asama:not([data-etkin]) { opacity: .42; }
.surec-adimlar--canli .asama:not([data-etkin]):hover { opacity: .8; }
}
.asama__alt { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 16px; margin-top: 22px; }
.detay-dugme { display: inline-flex; align-items: center; gap: 10px; min-height: 40px; padding: 8px 16px 8px 12px; border: 1px solid var(--murekkep); background: transparent; cursor: pointer; font-size: .875rem; font-weight: 500; transition: background-color .3s var(--egri), color .3s var(--egri); }
.detay-dugme__arti { display: grid; place-items: center; width: 18px; height: 18px; font-size: 1.125rem; font-weight: 400; line-height: 1; transition: transform .4s var(--egri); }
.detay-dugme:hover { background: var(--murekkep); color: var(--sis); }
.detay-dugme:hover .detay-dugme__arti { transform: rotate(90deg); }
.detay { width: min(760px, calc(100vw - 32px)); max-width: none; max-height: min(88dvh, 920px); margin: auto; padding: 0; border: 1px solid var(--murekkep); background: var(--kagit); color: var(--murekkep); overflow: hidden; }
.detay[open] { display: flex; }
.detay::backdrop { background: rgba(20, 23, 21, .46); -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); }
@media (prefers-reduced-motion: no-preference) {
.detay[open] { animation: detay-gir .45s var(--egri); }
.detay[open]::backdrop { animation: belir .35s var(--egri); }
}
@keyframes detay-gir { from { transform: translateY(16px); opacity: 0; } }
.detay__ic { flex: 1; overflow-y: auto; padding: 0 clamp(20px, 4vw, 44px) clamp(24px, 4vw, 40px); overscroll-behavior: contain; }
.detay__bas { position: sticky; top: 0; z-index: 1; display: grid; gap: 6px; padding: clamp(20px, 3vw, 32px) 56px 16px 0; margin-bottom: 20px; background: var(--kagit); border-bottom: 1px solid var(--cizgi); }
.detay__ust { display: flex; gap: 12px; align-items: baseline; font-size: .6875rem; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--tas); }
.detay__no { color: var(--kestane); letter-spacing: .08em; font-variant-numeric: tabular-nums; }
.detay__baslik { font-size: var(--t-1); font-weight: 400; line-height: 1; letter-spacing: -.045em; }
.detay__sure { margin-top: 4px; font-size: .875rem; color: var(--tas); font-variant-numeric: tabular-nums; }
.detay__sure-sayi { font-size: var(--t-3); color: var(--murekkep); letter-spacing: -.02em; }
.detay__zaman { width: 100%; height: 6px; margin-top: 6px; }
.detay__kapat-form { position: absolute; top: clamp(14px, 2.4vw, 24px); right: 0; margin: 0; }
.detay__kapat { display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 1px solid var(--cizgi); background: var(--kagit); cursor: pointer; transition: border-color .3s, background-color .3s, color .3s; }
.detay__kapat:hover { border-color: var(--murekkep); background: var(--murekkep); color: var(--sis); }
.detay__kapat .ikon { width: 18px; height: 18px; }
.detay__giris { max-width: 38em; font-size: var(--t-3); line-height: 1.45; letter-spacing: -.012em; text-wrap: pretty; }
.detay__bolum { margin-top: 28px; }
.detay__adimlar { margin-top: 10px; border-top: 1px solid var(--murekkep); }
.detay__adimlar li { display: grid; grid-template-columns: 2.6em minmax(0, 1fr); gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--cizgi); }
.detay__adim-no { padding-top: .2em; font-size: .75rem; font-weight: 500; letter-spacing: .06em; color: var(--kestane); font-variant-numeric: tabular-nums; }
.detay__adimlar p { color: var(--arduvaz); }
.detay__adimlar strong { display: block; font-weight: 500; color: var(--murekkep); }
.detay__bilgi { display: grid; gap: 12px; margin-top: 24px; }
.detay__bilgi > div { display: grid; grid-template-columns: 4.5em minmax(0, 1fr); gap: 12px; align-items: baseline; }
.detay__bilgi dt { font-size: .6875rem; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--tas); }
.detay__dikkat { display: grid; gap: 8px; margin-top: 28px; padding: 16px 18px; border-left: 2px solid var(--kestane); background: color-mix(in srgb, var(--kestane) 7%, transparent); }
.detay__dikkat .etiket { color: var(--kestane); }
.detay__dikkat ul { display: grid; gap: 6px; }
.detay__dikkat li { font-size: .9375rem; color: var(--arduvaz); }
@media (max-width: 599px) {
.detay { width: 100vw; max-height: 100dvh; height: 100dvh; border: 0; }
.detay__bilgi > div { grid-template-columns: 1fr; gap: 6px; }
}
.film { position: relative; height: calc(100svh - var(--ust-yuk)); min-height: 520px; margin-top: clamp(56px, 7vw, 112px); background: #c9d3d6; overflow: hidden; scroll-margin-top: var(--ust-yuk); }
.film__sahne { position: absolute; inset: 0; }
.film__tuval { position: absolute; inset: 0; display: block; width: 100%; height: 100%; }
.film__tuval:focus-visible { outline-offset: -3px; }
.film__yukleniyor { position: absolute; left: 50%; top: 50%; translate: -50% -50%; transition: opacity .6s; }
.film--hazir .film__yukleniyor { opacity: 0; }
.film-arayuz { --pano: color-mix(in srgb, var(--kagit) 90%, transparent); --pano-cizgi: color-mix(in srgb, var(--murekkep) 16%, transparent); position: absolute; inset: 0; display: grid; grid-template-columns: minmax(0, 340px) minmax(0, 1fr) auto; grid-template-rows: auto minmax(0, 1fr) auto; gap: 12px; padding: clamp(12px, 1.8vw, 22px); pointer-events: none; }
.film-arayuz > * { pointer-events: auto; }
.film-kart, .film-kutu, .film-ray, .film-cubuk { background: var(--pano); border: 1px solid var(--pano-cizgi); -webkit-backdrop-filter: blur(10px) saturate(1.1); backdrop-filter: blur(10px) saturate(1.1); }
.film-kart { grid-column: 1; grid-row: 1 / 3; align-self: start; display: grid; gap: 8px; max-height: 100%; overflow-y: auto; padding: 16px 18px 18px; }
.film-kart__evre { font-size: .6875rem; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--kestane); }
.film-kart__baslik { font-size: var(--t-3); line-height: 1.15; letter-spacing: -.02em; }
.film-kart__aciklama { font-size: .875rem; line-height: 1.5; color: var(--arduvaz); }
.film-kart__isler { display: grid; gap: 6px; margin-top: 4px; }
.film-kart__isler li { display: grid; grid-template-columns: minmax(0, 1fr) 42%; gap: 10px; align-items: center; font-size: .8125rem; color: var(--arduvaz); }
.film-kart__isler li[data-tamam] { color: var(--murekkep); }
.film-kart__cubuk { height: 4px; background: var(--sis-3); overflow: hidden; }
.film-kart__dolgu { display: block; height: 100%; background: var(--murekkep); transform-origin: left; transform: scaleX(0); }
.film-kart__ayrinti-dugme { justify-self: start; margin-top: 2px; padding: 4px 0; border: 0; background: none; cursor: pointer; font-size: .8125rem; font-weight: 500; text-decoration: underline; text-underline-offset: .22em; color: var(--murekkep); }
.film-kart__ayrinti { display: grid; gap: 6px; padding-top: 8px; border-top: 1px solid var(--cizgi); }
.film-kart__ayrinti li { position: relative; padding-left: 14px; font-size: .8125rem; line-height: 1.45; color: var(--arduvaz); }
.film-kart__ayrinti li::before { content: ""; position: absolute; left: 0; top: .6em; width: 6px; height: 1px; background: var(--kestane); }
.film-kutular { grid-column: 3; grid-row: 1; display: flex; gap: 8px; margin: 0; }
.film-kutu { min-width: 104px; padding: 10px 14px 12px; }
.film-kutu dt { font-size: .625rem; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--tas); }
.film-kutu dd { margin-top: 2px; font-size: 1.25rem; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.film-ray { grid-column: 3; grid-row: 2; align-self: start; justify-self: end; display: grid; gap: 8px; width: 224px; padding: 14px; }
.film-ray__baslik { font-size: .625rem; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--tas); }
.film-ray__baslik:not(:first-child) { margin-top: 6px; }
.film-secim { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; }
.film-secim--kucuk { grid-template-columns: repeat(auto-fit, minmax(0, 1fr)); }
.film-secim button, .film-kamera { min-height: 36px; padding: 6px 8px; border: 1px solid var(--cizgi-koyu); background: transparent; cursor: pointer; font-size: .8125rem; font-weight: 500; color: var(--murekkep); transition: background-color .25s, color .25s, border-color .25s; }
.film-secim button:hover, .film-kamera:hover { border-color: var(--murekkep); }
.film-secim button[aria-pressed="true"], .film-kamera[aria-pressed="true"] { border-color: var(--murekkep); background: var(--murekkep); color: var(--sis); }
.film-kamera { display: inline-flex; align-items: center; justify-content: center; gap: 8px; }
.film-secim--kucuk button { padding-inline: 4px; font-size: .75rem; }
.film-kamera svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linejoin: round; }
.film-kesit { display: grid; gap: 8px; }
.film-kesit__konum { width: 100%; margin: 0; accent-color: var(--murekkep); }
.film-cubuk { grid-column: 1 / -1; grid-row: 3; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: clamp(12px, 2vw, 24px); align-items: center; padding: 10px 14px; }
.film-oynatma { display: flex; gap: 4px; }
.film-dugme { display: grid; place-items: center; width: 40px; height: 40px; padding: 0; border: 1px solid transparent; background: none; cursor: pointer; color: var(--murekkep); transition: border-color .25s, background-color .25s, color .25s; }
.film-dugme:hover { border-color: var(--cizgi-koyu); }
.film-dugme svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linejoin: round; stroke-linecap: round; }
.film-dugme--ana { border-color: var(--murekkep); background: var(--murekkep); color: var(--sis); }
.film-dugme--ana:hover { background: transparent; color: var(--murekkep); }
.film-dugme--ana svg { fill: currentColor; stroke: none; }
.film-dugme--hiz { width: auto; min-width: 44px; padding: 0 8px; font-size: .8125rem; font-weight: 600; font-variant-numeric: tabular-nums; }
.film-cizelge { display: grid; gap: 6px; padding: 6px 0; cursor: pointer; touch-action: none; }
.film-cizelge__iz { position: relative; display: flex; gap: 2px; height: 8px; }
.film-cizelge__parca { position: relative; flex-basis: 0; background: var(--sis-3); overflow: hidden; }
.film-cizelge__dolgu { position: absolute; inset: 0; background: var(--murekkep); transform-origin: left; transform: scaleX(0); }
.film-cizelge__imlec { position: absolute; top: -5px; bottom: -5px; width: 2px; margin-left: -1px; background: var(--kestane); pointer-events: none; }
.film-cizelge__evreler { display: flex; gap: 2px; }
.film-cizelge__evre { flex-basis: 0; min-width: 0; padding: 0; border: 0; background: none; cursor: pointer; overflow: hidden; text-align: left; white-space: nowrap; text-overflow: ellipsis; font-size: .6875rem; color: var(--tas); }
.film-cizelge__evre span { margin-right: .4em; font-variant-numeric: tabular-nums; color: var(--cizgi-koyu); }
.film-cizelge__evre[data-etkin] { color: var(--murekkep); }
.film-cizelge__evre[data-etkin] span { color: var(--kestane); }
.film-zaman { font-size: .75rem; color: var(--tas); font-variant-numeric: tabular-nums; white-space: nowrap; }
.film-kart, .film-ray { scrollbar-width: thin; }
@media (max-width: 899px) {
.film-arayuz { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto minmax(0, 1fr) auto auto; gap: 8px; }
.film-kart { grid-column: 1; grid-row: 1; padding: 12px 14px; gap: 4px; }
.film-kart__aciklama { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: .8125rem; }
.film-kart__isler, .film-kart__ayrinti-dugme, .film-kart__ayrinti { display: none; }
.film-kutular { display: none; }
.film-ray { grid-column: 1; grid-row: 3; justify-self: stretch; width: auto; display: flex; gap: 6px; overflow-x: auto; padding: 8px; }
.film-ray__baslik { display: none; }
.film-secim, .film-secim--kucuk, .film-kesit { display: flex; gap: 4px; flex: none; }
.film-kesit[hidden] { display: none; }
.film-secim button, .film-kamera { flex: none; min-height: 36px; padding: 6px 10px; white-space: nowrap; }
.film-kesit__konum { width: 120px; }
.film-cubuk { grid-row: 4; grid-template-columns: auto minmax(0, 1fr); gap: 10px; padding: 8px 10px; }
.film-cizelge__evreler, .film-zaman { display: none; }
.film-dugme { width: 36px; height: 36px; }
}
@media (max-width: 999px) {
.surec-adimlar { display: block; }
.santiye { top: var(--ust-yuk); z-index: 5; grid-template-columns: minmax(0, 1fr) auto; column-gap: 16px; row-gap: 8px; align-items: end; padding: 10px 0 12px; background: var(--sis); border-bottom: 1px solid var(--cizgi); }
.santiye__bas { grid-column: 1; grid-row: 1; flex-direction: column; align-items: flex-start; gap: 6px; padding-top: 0; border-top: 0; }
.santiye__ad { text-align: left; font-size: .9375rem; }
.santiye__cizim { grid-column: 2; grid-row: 1; }
.santiye__svg { height: 26svh; max-height: 240px; }
.santiye__cubuk { grid-column: 1 / -1; }
.sc-yazi, .sc-not { display: none; }
.asama { scroll-margin-top: calc(var(--ust-yuk) + min(26svh, 240px) + 64px); }
}
@media (max-width: 599px) {
.asama__zaman, .asama__not, .asama__bilgi, .dongu, .asama__alt { margin-left: 0; }
.asama__bas { grid-template-columns: 2.4em 1fr auto; }
.asama__bilgi > div { grid-template-columns: 1fr; gap: 6px; }
}
.gorusme { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--aralik); row-gap: 40px; padding-top: clamp(40px, 6vw, 96px); padding-bottom: var(--bolum); }
.gorusme__bas { grid-column: 1 / 6; align-self: start; position: sticky; top: calc(var(--ust-yuk) + 24px); }
.gorusme__bas > .bolum-no { display: block; padding: 0 0 16px; margin-bottom: 28px; border-bottom: 1px solid var(--murekkep); }
.gorusme__adimlar { margin-top: 36px; border-top: 1px solid var(--cizgi); }
.gorusme__adimlar li { display: flex; gap: 14px; padding: 12px 0; border-bottom: 1px solid var(--cizgi); }
.gorusme__adimlar span { font-size: .75rem; font-weight: 500; color: var(--kestane); font-variant-numeric: tabular-nums; }
.gorusme__not { margin-top: 20px; font-size: .875rem; color: var(--tas); }
.gorusme__form { grid-column: 7 / -1; background: var(--kagit); border: 1px solid var(--cizgi); }
@media (max-width: 999px) { .gorusme__bas, .gorusme__form { grid-column: 1 / -1; position: static; } }
.metin-sayfa { padding-bottom: var(--bolum); }
.metin-sayfa__govde { max-width: 42em; margin-left: calc((100% + var(--aralik)) * 3 / 12); }
.metin-sayfa__govde h2 { margin: 36px 0 10px; font-size: .75rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--kestane); }
.metin-sayfa__govde p { color: var(--arduvaz); }
@media (max-width: 899px) { .metin-sayfa__govde { margin-left: 0; } }
.yok { min-height: calc(80svh - var(--ust-yuk)); display: flex; flex-direction: column; justify-content: center; padding-block: 96px; }
.yok .bolum-no { padding: 0; margin-bottom: 28px; }
.yok__baslik { max-width: 13ch; font-size: var(--t-1); font-weight: 400; line-height: 1.02; letter-spacing: -.045em; }
.yok__kot { margin: 40px 0 48px; color: var(--kestane); }
.yok__kot .kot { font-size: 1.125rem; }
.yok__eylem { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 28px; }
.randevu-pencere { width: min(620px, 100vw); max-width: 100vw; height: 100dvh; max-height: 100dvh; margin: 0 0 0 auto; padding: 0; border: 0; border-left: 1px solid var(--cizgi); background: var(--kagit); color: var(--murekkep); overflow: hidden; }
.randevu-pencere[open] { display: flex; }
.randevu-pencere::backdrop { background: rgba(20, 23, 21, .42); -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); }
@media (prefers-reduced-motion: no-preference) {
.randevu-pencere[open] { animation: cekmece-gir .55s var(--egri); }
.randevu-pencere[open]::backdrop { animation: belir .4s var(--egri); }
}
@keyframes cekmece-gir { from { transform: translateX(40px); opacity: 0; } }
html[data-pencere-acik] { overflow: hidden; }
.randevu { display: flex; flex-direction: column; width: 100%; min-height: 100%; }
.randevu-pencere .randevu { height: 100%; }
.randevu__bas { position: relative; padding: 24px clamp(20px, 3.2vw, 36px) 0; }
.randevu__baslik { margin-top: 6px; font-size: clamp(1.75rem, 1.4rem + 1.4vw, 2.4rem); font-weight: 400; letter-spacing: -.045em; line-height: 1.05; }
.randevu__kapat { position: absolute; top: 16px; right: 16px; display: grid; place-items: center; width: 44px; height: 44px; border: 1px solid var(--cizgi); background: none; cursor: pointer; }
.randevu__kapat:hover { border-color: var(--murekkep); }
.randevu__kapat .ikon { width: 18px; height: 18px; }
.randevu__adimlar { display: grid; grid-template-columns: repeat(4, 1fr); margin-top: 22px; border-top: 1px solid var(--cizgi); }
.randevu__adimlar li { position: relative; padding: 10px 0 12px; font-size: .75rem; font-weight: 500; color: var(--cizgi-koyu); }
.randevu__adimlar li span { display: block; font-size: .625rem; letter-spacing: .1em; font-variant-numeric: tabular-nums; }
.randevu__adimlar li::before { content: ""; position: absolute; left: 0; right: 0; top: -1px; height: 2px; background: var(--murekkep); transform: scaleX(0); transform-origin: left; transition: transform .5s var(--egri); }
.randevu__adimlar li[aria-current="step"] { color: var(--murekkep); }
.randevu__adimlar li[aria-current="step"]::before, .randevu__adimlar li[data-gecti]::before { transform: scaleX(1); }
.randevu__adimlar li[data-gecti] { color: var(--kestane); }
.randevu__adimlar li[data-gecti]::before { background: var(--kestane); }
.randevu[data-tamam] .randevu__adimlar { display: none; }
.randevu__govde { flex: 1; overflow-y: auto; padding: 24px clamp(20px, 3.2vw, 36px) 28px; overscroll-behavior: contain; }
.randevu__adim { display: grid; gap: 22px; align-content: start; }
.randevu__adim:focus { outline: none; }
.randevu__soru { font-size: var(--t-3); font-weight: 450; letter-spacing: -.02em; }
.randevu__soru:focus { outline: none; }
.randevu__dipnot { font-size: .8125rem; color: var(--tas); }
.randevu__yukleniyor { display: flex; align-items: center; gap: 14px; min-height: 96px; font-size: .875rem; color: var(--tas); }
.randevu__tekrar { padding: 0; border: 0; background: none; color: var(--kestane); text-decoration: underline; cursor: pointer; }
.gunler__liste { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 8px; scroll-snap-type: x mandatory; scrollbar-width: thin; }
.gun { position: relative; display: grid; justify-items: center; gap: 2px; flex: none; width: 66px; padding: 10px 0 12px; border: 1px solid var(--cizgi); background: var(--sis); cursor: pointer; scroll-snap-align: start; transition: border-color .25s, background-color .25s, color .25s; }
.gun input, .saat input, .secim input { position: absolute; inset: 0; margin: 0; opacity: 0; cursor: pointer; }
.gun__ad { font-size: .625rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--tas); }
.gun__no { font-size: 1.5rem; font-weight: 400; letter-spacing: -.03em; line-height: 1.1; font-variant-numeric: tabular-nums; }
.gun__ay { font-size: .6875rem; color: var(--tas); }
.gun:hover { border-color: var(--murekkep); }
.gun:has(input:checked) { border-color: var(--murekkep); background: var(--murekkep); color: var(--sis); }
.gun:has(input:checked) .gun__ad, .gun:has(input:checked) .gun__ay { color: var(--cizgi); }
.gun:has(input:disabled) { opacity: .45; cursor: not-allowed; }
.gun:has(input:focus-visible), .saat:has(input:focus-visible), .secim:has(input:focus-visible) { outline: 1.5px solid var(--kestane); outline-offset: 2px; }
.saatler__baslik { margin-bottom: 10px; font-size: .6875rem; font-weight: 500; letter-spacing: .1em; text-transform: uppercase; color: var(--tas); }
.saatler__liste { display: grid; grid-template-columns: repeat(auto-fill, minmax(92px, 1fr)); gap: 8px; }
.saat { position: relative; display: grid; place-items: center; min-height: 48px; border: 1px solid var(--cizgi); background: var(--sis); cursor: pointer; font-size: 1rem; font-variant-numeric: tabular-nums; transition: border-color .25s, background-color .25s, color .25s; }
.saat:hover { border-color: var(--murekkep); }
.saat:has(input:checked) { border-color: var(--murekkep); background: var(--murekkep); color: var(--sis); }
.saat:has(input:disabled) { color: var(--cizgi-koyu); text-decoration: line-through; cursor: not-allowed; background: transparent; }
.konular { display: flex; flex-wrap: wrap; gap: 8px; }
.secim { position: relative; display: inline-flex; align-items: center; min-height: 44px; padding: 8px 16px; border: 1px solid var(--cizgi); background: var(--sis); cursor: pointer; font-size: .9375rem; transition: border-color .25s, background-color .25s, color .25s; }
.secim:hover { border-color: var(--murekkep); }
.secim:has(input:checked) { border-color: var(--murekkep); background: var(--murekkep); color: var(--sis); }
.alanlar { display: grid; gap: 18px; }
.alan { display: grid; gap: 6px; }
.alan__etiket { font-size: .6875rem; font-weight: 500; letter-spacing: .1em; text-transform: uppercase; color: var(--tas); }
.alan__etiket span { text-transform: none; letter-spacing: 0; }
.alan__girdi { width: 100%; padding: 10px 0 9px; border: 0; border-bottom: 1px solid var(--cizgi-koyu); border-radius: 0; background: transparent; font-size: 1.0625rem; transition: border-color .25s; }
textarea.alan__girdi { resize: vertical; min-height: 84px; }
.alan__girdi::placeholder { color: var(--cizgi-koyu); }
.alan__girdi:focus { outline: none; border-bottom-color: var(--murekkep); box-shadow: 0 1px 0 var(--murekkep); }
.alan__girdi[aria-invalid="true"] { border-bottom-color: var(--kestane); box-shadow: 0 1px 0 var(--kestane); }
.alan__hata { font-size: .8125rem; color: var(--kestane); }
.alan__hata:empty { display: none; }
.onay { display: grid; grid-template-columns: 20px 1fr; gap: 12px; align-items: start; font-size: .875rem; color: var(--arduvaz); cursor: pointer; }
.onay input { width: 18px; height: 18px; margin: 2px 0 0; accent-color: var(--murekkep); }
.onay a { color: var(--murekkep); }
.bal { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.ozet { border-top: 1px solid var(--murekkep); }
.ozet > div { display: grid; grid-template-columns: 7.5em 1fr; gap: 12px; padding: 11px 0; border-bottom: 1px solid var(--cizgi); font-size: .9375rem; }
.ozet dt { padding-top: .2em; font-size: .6875rem; font-weight: 500; letter-spacing: .1em; text-transform: uppercase; color: var(--tas); }
.ozet dd { overflow-wrap: anywhere; }
.randevu__tamam-baslik { font-size: clamp(2.2rem, 1.6rem + 2.4vw, 3.4rem); font-weight: 380; letter-spacing: -.05em; line-height: 1; }
.randevu__tamam-not { font-size: .9375rem; color: var(--arduvaz); }
.randevu__takvim { display: flex; flex-wrap: wrap; gap: 12px 24px; }
.randevu__tamam .etiket { color: var(--kestane); }
.randevu__hata { margin: 0 clamp(20px, 3.2vw, 36px) 12px; padding: 10px 14px; border-left: 2px solid var(--kestane); background: color-mix(in srgb, var(--kestane) 8%, transparent); font-size: .875rem; color: var(--kestane); }
.randevu__alt { display: flex; align-items: center; justify-content: flex-end; gap: 12px; padding: 14px clamp(20px, 3.2vw, 36px) calc(14px + env(safe-area-inset-bottom)); border-top: 1px solid var(--cizgi); background: var(--kagit); }
.randevu__geri { margin-right: auto; padding: 10px 4px; border: 0; background: none; cursor: pointer; font-size: .9375rem; font-weight: 500; color: var(--arduvaz); text-decoration: underline; text-underline-offset: .22em; }
.randevu__alt .dugme[aria-busy="true"] { position: relative; color: transparent; }
.randevu__alt .dugme[aria-busy="true"] .ikon { opacity: 0; }
.randevu__alt .dugme[aria-busy="true"]::after { content: ""; position: absolute; left: 22%; right: 22%; top: 50%; height: 1px; background: linear-gradient(var(--sis), var(--sis)) 0 0 / 0 100% no-repeat, color-mix(in srgb, var(--sis) 30%, transparent); animation: yukleyici 1s var(--egri-2) infinite; }
.gorusme__form .randevu__alt { position: sticky; bottom: 0; }
@media (max-width: 599px) { .randevu-pencere { width: 100vw; border-left: 0; } .gun { width: 60px; } }
@view-transition { navigation: auto; }
::view-transition-old(root), ::view-transition-new(root) { animation-duration: .45s; animation-timing-function: var(--egri); }
::view-transition-group(proje-kapak) { animation-duration: .6s; animation-timing-function: var(--egri); }
@supports (animation-timeline: scroll()) {
@media (prefers-reduced-motion: no-preference) {
.ust { animation: ust-cizgi linear both; animation-timeline: scroll(root); animation-range: 0 64px; }
.ust::before { animation: ust-zemin linear both; animation-timeline: scroll(root); animation-range: 0 64px; }
html[data-menu-acik] .ust, html[data-menu-acik] .ust::before { animation: none; }
}
}
@keyframes ust-cizgi { from { border-bottom-color: transparent; } }
@keyframes ust-zemin { from { opacity: 0; } }
@media (prefers-reduced-motion: reduce) {
*, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; animation-delay: 0s !important; animation-iteration-count: 1 !important; }
::view-transition-group(*), ::view-transition-old(*), ::view-transition-new(*) { animation: none !important; }
}
@media print {
.ust, .menu, .kopyala, .atla, .antet__basa, .randevu-pencere, .maket, .vitrin__3b { display: none !important; }
.santiye { position: static; }
.iletisim, .bant { background: none; color: var(--murekkep); }
.bolum { padding-block: 32px; }
}