@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; }
.marka__isaret { width: auto; height: 32px; }
.marka__ad { font-size: .8125rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; white-space: nowrap; }
.marka__yer { padding-left: 12px; border-left: 1px solid var(--cizgi-koyu); font-size: .6875rem; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; color: var(--tas); }
.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; } .marka__yer { display: none; } }
@media (max-width: 899px) {
.marka__isaret { height: 28px; }
.marka__yer { display: inline; }
.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; }
.marka__yer { padding-left: 10px; font-size: .625rem; }
}
.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); }
.acilis__eylem { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 32px; margin-top: clamp(32px, 4vw, 56px); }
@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; }
}
.hat { margin-top: clamp(24px, 3.2vw, 48px); }
.hat__sahne { position: relative; }
.hat__svg { width: 100%; height: auto; overflow: visible; }
.hat__svg--dar { display: none; }
.hat__kiyi { fill: none; stroke: var(--murekkep); stroke-width: 1.35; stroke-linejoin: round; stroke-linecap: round; }
.hat__kiris { fill: none; stroke: var(--tas); stroke-width: 1; stroke-dasharray: 5 7; }
.hat__olcu { fill: none; stroke: var(--murekkep); stroke-width: 1.2; }
.hat__merkez { fill: var(--murekkep); }
.hat__koken { fill: var(--sis); stroke: var(--murekkep); stroke-width: 1.6; }
.hat__nabiz { fill: none; stroke: var(--kestane); stroke-width: 1.2; opacity: 0; transform-box: fill-box; transform-origin: center; }
.hat__deniz { position: absolute; left: 13%; top: 20%; margin: 0; font-size: clamp(1rem, .8rem + .8vw, 1.5rem); color: var(--tas); }
.hat__deniz .vurgu { font-size: 1em; }
.hat__svg--dar .hat__kiyi { stroke-width: 2.4; }
.hat__svg--dar .hat__kiris { stroke-width: 1.8; stroke-dasharray: 8 10; }
.hat__svg--dar .hat__olcu { stroke-width: 2; }
.hat__svg--dar .hat__koken { stroke-width: 2.6; }
.hat__alt { display: grid; grid-template-columns: 1fr auto 1fr; align-items: start; gap: 16px; margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--cizgi); }
.hat__nokta--koken { text-align: right; }
.hat__rol { font-size: .6875rem; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--tas); }
.hat__nokta--merkez .hat__rol { color: var(--murekkep); }
.hat__yer { margin-top: 6px; font-size: clamp(1.75rem, 1.2rem + 2.4vw, 3.25rem); font-weight: 400; line-height: 1; letter-spacing: -.045em; }
.hat__detay { margin-top: 8px; font-size: .9375rem; color: var(--arduvaz); }
.hat__koord { margin-top: 2px; font-size: .75rem; letter-spacing: .04em; color: var(--tas); font-variant-numeric: tabular-nums; }
.hat__mesafe { align-self: center; display: inline-flex; flex-direction: column; align-items: center; gap: 4px; font-size: .75rem; letter-spacing: .06em; color: var(--tas); text-align: center; }
.hat__mesafe > span:nth-child(2) { font-size: 1.0625rem; font-weight: 500; letter-spacing: -.01em; color: var(--murekkep); font-variant-numeric: tabular-nums; }
.hat__mesafe-cizgi { width: 64px; height: 1px; background: repeating-linear-gradient(90deg, var(--tas) 0 5px, transparent 5px 11px); }
.hat__imlec { position: absolute; inset: 0; pointer-events: none; }
.hat__imlec-y, .hat__imlec-x { position: absolute; background: color-mix(in srgb, var(--kestane) 70%, transparent); }
.hat__imlec-y { top: 0; bottom: 0; left: var(--x, 0); width: 1px; }
.hat__imlec-x { left: 0; right: 0; top: var(--y, 0); height: 1px; }
.hat__imlec span { position: absolute; left: calc(var(--x, 0) + 10px); top: calc(var(--y, 0) + 8px); padding: 2px 6px; background: var(--sis); font-size: .6875rem; letter-spacing: .04em; color: var(--kestane); white-space: nowrap; font-variant-numeric: tabular-nums; }
@media (max-width: 699px) {
.hat__svg--genis { display: none; }
.hat__svg--dar { display: block; }
.hat__deniz { left: 1%; top: -2%; }
.hat__alt { grid-template-columns: 1fr 1fr; }
.hat__mesafe { grid-column: 1 / -1; grid-row: 2; flex-direction: row; justify-content: center; gap: 10px; padding-top: 12px; border-top: 1px dashed var(--cizgi); }
}
@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__eylem, .hat__alt, .acilis__ust, .hat__deniz { opacity: 0; animation: belir 1s var(--egri) .5s forwards; }
.hat__alt { animation-delay: 1.9s; }
.hat__deniz { animation-delay: 2.1s; }
.hat__kiyi { stroke-dasharray: 1; stroke-dashoffset: 1; animation: ciz 2.6s var(--egri-2) .35s forwards; }
.hat__kiris, .hat__olcu, .hat__koken, .hat__merkez { opacity: 0; animation: belir .9s var(--egri) forwards; }
.hat__koken { animation-delay: .3s; }
.hat__kiris, .hat__olcu { animation-delay: 2.4s; }
.hat__merkez { animation-delay: 2.8s; }
.hat__nabiz { animation: nabiz 2.4s var(--egri) 3s 2; }
}
@keyframes satir-yuksel { to { transform: none; } }
@keyframes belir { to { opacity: 1; } }
@keyframes ciz { to { stroke-dashoffset: 0; } }
@keyframes nabiz { 0% { opacity: .9; transform: scale(1); } 100% { opacity: 0; transform: scale(3.2); } }
.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(88px, 11vw, 168px); }
.kimlik__logo { --pay: clamp(24px, 3vw, 44px); position: relative; grid-column: 4 / 7; padding: var(--pay); background: #fff; border: 1px solid var(--cizgi); }
.kimlik__logo img { width: 100%; }
.kimlik__ucgen-isaret { position: absolute; left: calc(var(--pay) + (100% - 2 * var(--pay)) * .519); top: calc(var(--pay) + (100% - 2 * var(--pay)) * .331); width: 0; height: 0; pointer-events: none; }
.kimlik__ucgen-isaret i { position: absolute; left: -5px; top: -5px; width: 10px; height: 10px; border: 1.5px solid var(--kestane); border-radius: 50%; }
@media (prefers-reduced-motion: no-preference) { .kimlik:hover .kimlik__ucgen-isaret i { animation: nabiz-halka 1.6s var(--egri) infinite; } }
@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; }
.kimlik__ucgen { display: grid; gap: 10px; padding-top: 16px; border-top: 1px solid var(--cizgi); color: var(--murekkep); }
.kimlik__ucgen .kot { justify-self: start; color: var(--kestane); }
@media (max-width: 1099px) { .kimlik__logo { grid-column: 2 / 7; } }
@media (max-width: 699px) {
.kimlik { display: block; }
.kimlik__logo { max-width: 280px; margin-bottom: 32px; }
}
.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; }
}
.uclu { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--murekkep); margin-bottom: clamp(64px, 8vw, 120px); }
.uclu__oge { position: relative; padding: 20px clamp(12px, 1.6vw, 24px) 8px 0; }
.uclu__oge + .uclu__oge { padding-left: clamp(12px, 1.6vw, 24px); border-left: 1px solid var(--cizgi); }
.uclu__no { font-size: .6875rem; font-weight: 500; letter-spacing: .12em; color: var(--kestane); }
.uclu__terim { margin: 18px 0 16px; font-size: clamp(3rem, 1.6rem + 5.4vw, 7rem); font-weight: 330; line-height: .92; letter-spacing: -.06em; transition: letter-spacing .7s var(--egri); }
.uclu__oge:hover .uclu__terim { letter-spacing: -.035em; }
.uclu__metin { max-width: 20em; font-size: .9375rem; color: var(--arduvaz); }
@media (max-width: 699px) {
.uclu { grid-template-columns: 1fr; }
.uclu__oge + .uclu__oge { padding-left: 0; border-left: 0; border-top: 1px solid var(--cizgi); }
.uclu__terim { margin: 10px 0; }
}
.akslar { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.aks { position: relative; padding: 70px clamp(14px, 1.8vw, 28px) 8px; }
.aks::before, .aks:last-child::after {
content: ""; position: absolute; top: 34px; bottom: -24px; left: 0; width: 1px;
background: repeating-linear-gradient(to bottom, var(--cizgi-koyu) 0 16px, transparent 16px 21px, var(--cizgi-koyu) 21px 23px, transparent 23px 28px);
}
.aks:last-child::after { left: auto; right: 0; }
.aks__balon { position: absolute; top: 0; left: 0; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; border: 1px solid var(--murekkep); background: var(--sis); font-size: .75rem; font-weight: 600; transform: translateX(-50%); transition: background-color .35s, color .35s; }
.aks:hover .aks__balon { background: var(--murekkep); color: var(--sis); }
.aks__terim { font-size: var(--t-3); font-weight: 450; letter-spacing: -.02em; line-height: 1.15; }
.aks__metin { margin-top: 12px; font-size: .9375rem; color: var(--arduvaz); max-width: 18em; }
@media (max-width: 1099px) {
.akslar { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 56px; }
.aks:nth-child(2)::after { content: ""; position: absolute; top: 34px; bottom: -24px; right: 0; width: 1px; background: repeating-linear-gradient(to bottom, var(--cizgi-koyu) 0 16px, transparent 16px 21px, var(--cizgi-koyu) 21px 23px, transparent 23px 28px); }
}
@media (max-width: 599px) {
.akslar { grid-template-columns: 1fr; row-gap: 0; margin-left: 17px; }
.aks { padding: 2px 0 40px 36px; }
.aks::before, .aks:nth-child(2)::after { top: 34px; bottom: 0; left: 0; right: auto; }
.aks:last-child::after { display: 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%; }
.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: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-yok .vitrin__ipucu, .vitrin__medya.maket-yok .vitrin__3b { display: none; }
.vitrin__medya--maket .vitrin__maket { opacity: 1; }
.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__ad a { text-decoration: none; }
.vitrin__ad a:hover { text-decoration: underline; text-decoration-thickness: 1px; }
.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); }
.projeler__tum { margin-top: clamp(40px, 5vw, 72px); }
.proje-listesi { border-top: 1px solid var(--murekkep); margin-bottom: clamp(56px, 7vw, 104px); }
.proje-listesi li { border-bottom: 1px solid var(--cizgi); }
.proje-listesi a { display: grid; grid-template-columns: 5em 3fr 2fr 1.5fr 4em; gap: 16px; align-items: baseline; padding: 18px 0; text-decoration: none; transition: padding .5s var(--egri), background-color .3s; }
.proje-listesi a:hover { padding-left: 12px; background: var(--sis-2); }
.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 a { 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__koken { margin-top: 18px; padding-top: 12px; border-top: 1px solid var(--orman-cizgi); font-size: .8125rem; color: var(--yosun); }
.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; } }
.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-items: center; padding: clamp(20px, 2.6vw, 36px); background: #fff; }
.antet__logo img { width: 100%; max-width: 132px; }
.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 img { max-width: 108px; }
}
.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); }
.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; }
.iletisim, .bant { background: none; color: var(--murekkep); }
.bolum { padding-block: 32px; }
}