/* Hâle Davet Atölyesi — v5 "davetiyeden geceye". Saf beyaz zemin, patlıcan derinlik, allık ışık, ölçülü pirinç.
   Bona Nova (display) + Gantari (metin). Hap biçim yok; düğme 4 px, kart ≤ 8 px. */
@font-face { font-family: 'Bona Nova'; src: url(font/bona-400.woff2) format('woff2'); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: 'Bona Nova'; src: url(font/bona-700.woff2) format('woff2'); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: 'Bona Nova'; src: url(font/bona-400i.woff2) format('woff2'); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: 'Gantari'; src: url(font/gantari.woff2) format('woff2'); font-weight: 100 900; font-style: normal; font-display: swap; }

:root {
  --beyaz: #fff; --sis: #F6F4F7; --sis2: #EEEAF0; --cz: #E7E0E8; --cz2: #D6CCD8;
  --mur: #2A1630; --pat: #3A1F3D; --pat2: #4D2A50; --pat3: #24122A;
  --al: #EAC7C7; --al2: #F8ECEC; --al3: #D9A9AE; --pir: #B08D57; --pirm: #866838; --pir2: #D9C29A;
  --gri: #6E6472; --gri2: #9A909E;
  --fd: 'Bona Nova', Georgia, 'Times New Roman', serif;
  --ft: 'Gantari', 'Bona Nova', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --g1: 0 1px 2px rgba(42, 22, 48, .06), 0 6px 16px -8px rgba(42, 22, 48, .14);
  --g2: 0 22px 44px -22px rgba(58, 31, 61, .34), 0 8px 18px -10px rgba(20, 10, 24, .16);
  --g3: 0 44px 88px -28px rgba(58, 31, 61, .42), 0 18px 36px -18px rgba(20, 10, 24, .22);
  --r: 4px; --rk: 8px; --ust: 80px;
  --kol: cubic-bezier(.2, .7, .2, 1);
}
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: calc(var(--ust) + 16px); }
body { margin: 0; background: var(--beyaz); color: var(--mur); font: 400 17px/1.62 var(--ft); font-feature-settings: 'kern'; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; overflow-x: clip; }
img, svg { display: block; max-width: 100%; }
img { height: auto; }
a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: .18em; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
h1, h2, h3, h4 { font-family: var(--fd); font-weight: 400; line-height: 1.04; letter-spacing: -.012em; margin: 0; text-wrap: balance; }
p { margin: 0; }
ul, ol { margin: 0; padding: 0; list-style: none; }
dl, dd { margin: 0; }
table { border-collapse: collapse; }
:focus-visible { outline: 2px solid var(--pir); outline-offset: 3px; }
::selection { background: var(--al); color: var(--pat3); }
[hidden] { display: none !important; }
.sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip { position: absolute; left: 12px; top: -60px; z-index: 200; background: var(--pat); color: #fff; padding: 10px 14px; border-radius: var(--r); }
.skip:focus { top: 12px; }
.wrap { width: min(1360px, 100%); margin: 0 auto; padding: 0 40px; }
.wrap-n { width: min(820px, 100%); margin: 0 auto; padding: 0 40px; }
.ic { width: 18px; height: 18px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.num, output { font-family: var(--fd); font-variant-numeric: lining-nums tabular-nums; }
[data-rv] { opacity: 0; transform: translateY(14px); transition: opacity .6s var(--kol), transform .6s var(--kol); }
[data-rv].in { opacity: 1; transform: none; }

/* ---------------------------------------------------------------- düğmeler, bağlantılar */
.btn { --b: var(--pat); --c: #fff; position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 48px; padding: 0 22px; border: 0; border-radius: var(--r); background: var(--b); color: var(--c); font: 600 15.5px/1.1 var(--ft); letter-spacing: .005em; text-decoration: none; white-space: nowrap; overflow: hidden; isolation: isolate; box-shadow: 0 1px 0 rgba(255, 255, 255, .12) inset, 0 10px 22px -12px rgba(58, 31, 61, .55); transition: transform .18s var(--kol), box-shadow .25s; }
.btn::before { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(100deg, transparent 20%, rgba(234, 199, 199, .28) 50%, transparent 80%); transform: translateX(-110%); transition: transform .6s var(--kol); }
.btn:hover::before { transform: translateX(110%); }
.btn:hover { box-shadow: 0 1px 0 rgba(255, 255, 255, .12) inset, 0 16px 28px -14px rgba(58, 31, 61, .6); }
.btn:active { transform: translateY(1px) scale(.99); }
.btn .ic { width: 17px; height: 17px; transition: transform .25s var(--kol); }
.btn:hover .ic { transform: translateX(3px); }
.btn--s { min-height: 40px; padding: 0 16px; font-size: 14.5px; }
.btn--lg { min-height: 56px; padding: 0 26px; font-size: 16.5px; }
.btn--gold { --b: var(--al); --c: var(--pat3); box-shadow: 0 10px 22px -14px rgba(176, 141, 87, .6); }
.btn--ghost { --b: transparent; --c: var(--pat); box-shadow: inset 0 0 0 1px var(--cz2); }
.btn--light { --b: #fff; --c: var(--pat3); }
.btn[disabled] { opacity: .55; cursor: default; }
.more { display: inline-flex; align-items: center; gap: 8px; color: var(--pat); font: 600 15.5px/1.3 var(--ft); text-decoration: none; }
.more span { background: linear-gradient(currentColor, currentColor) 0 100% / 0 1px no-repeat; padding-bottom: 2px; transition: background-size .35s var(--kol); }
.more:hover span { background-size: 100% 1px; }
.more .ic { width: 16px; height: 16px; color: var(--pir); transition: transform .25s var(--kol); }
.more:hover .ic { transform: translateX(4px); }
.more--light { color: #fff; }
.ok { width: 48px; height: 48px; display: inline-grid; place-items: center; border: 1px solid var(--cz2); border-radius: var(--r); background: #fff; color: var(--pat); transition: background .2s, border-color .2s; }
.ok:hover { background: var(--pat); border-color: var(--pat); color: #fff; }
.ok:disabled { opacity: .35; cursor: default; background: #fff; color: var(--pat); }

/* cumartesi noktaları */
.sat { display: inline-flex; gap: 3px; }
.sat i { width: 7px; height: 7px; border-radius: 50%; background: var(--pir); }
.sat i.x { background: transparent; box-shadow: inset 0 0 0 1.2px var(--cz2); }
.acik { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; color: var(--gri); }
.acik::before { content: ''; width: 8px; height: 8px; border-radius: 50%; background: var(--gri2); }
.acik.is-open { color: var(--mur); }
.acik.is-open::before { background: #5C9A72; box-shadow: 0 0 0 4px rgba(92, 154, 114, .16); }

/* ---------------------------------------------------------------- logo */
.logo { display: inline-flex; align-items: center; gap: 12px; color: var(--pat); }
.logo .mono { width: 40px; height: 40px; }
.logo .wm { height: 24px; width: auto; }
.logo .halo, .halo { stroke: var(--pir); }
.logo-t { font: 500 12.5px/1.15 var(--ft); letter-spacing: .02em; color: var(--gri); max-width: 64px; padding-left: 12px; border-left: 1px solid var(--cz); }


/* ================================================================ v5.1 "planlama masası" */
:root {
  --masa: #F1EEF2; --masa2: #E9E4EB;
  --keten: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .23 0 0 0 0 .12 0 0 0 0 .24 0 0 0 .07 0'/%3E%3C/filter%3E%3Crect width='220' height='220' filter='url(%23n)'/%3E%3C/svg%3E");
  --kagit: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.55' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .4 0 0 0 0 .3 0 0 0 0 .4 0 0 0 .035 0'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)'/%3E%3C/svg%3E");
  --yat: 0 1px 1px rgba(42, 22, 48, .08), 0 10px 18px -10px rgba(42, 22, 48, .26), 0 34px 60px -34px rgba(58, 31, 61, .38);
  --kalk: 0 2px 3px rgba(42, 22, 48, .08), 0 26px 40px -18px rgba(42, 22, 48, .3), 0 60px 90px -40px rgba(58, 31, 61, .42);
}
.keten { background-color: var(--masa); background-image: var(--keten), repeating-linear-gradient(0deg, rgba(58, 31, 61, .018) 0 1px, transparent 1px 3px), repeating-linear-gradient(90deg, rgba(58, 31, 61, .016) 0 1px, transparent 1px 3px); }

/* ---------------------------------------------------------------- başlık: logo · Menü (ortada) · tarih */
.ust { position: sticky; top: 0; z-index: 60; background: #fff; border-bottom: 1px solid transparent; transition: border-color .25s, box-shadow .25s; }
.ust.is-s { border-color: var(--cz); box-shadow: 0 10px 30px -24px rgba(42, 22, 48, .4); }
.ust-in, .ix-ust { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; height: var(--ust); padding: 0 40px; }
.ust-logo { justify-self: start; text-decoration: none; }
.ust-cta { justify-self: end; }
.ust-men { display: inline-flex; align-items: center; gap: 12px; height: 46px; padding: 0 18px 0 14px; border: 1px solid var(--cz); border-radius: var(--r); background: #fff; color: var(--pat); font: 400 20px/1 var(--fd); letter-spacing: .005em; transition: border-color .15s, background .15s; }
.ust-men:hover { border-color: var(--pat); }
.ust-men-k { position: relative; width: 22px; height: 18px; }
.ust-men-k i { position: absolute; left: 3px; top: 2px; width: 14px; height: 15px; border: 1.2px solid currentColor; border-radius: 1.5px; background: #fff; transition: transform .2s var(--kol); }
.ust-men-k i:nth-child(1) { transform: rotate(-14deg) translate(-2px, 1px); }
.ust-men-k i:nth-child(2) { transform: rotate(2deg); }
.ust-men-k i:nth-child(3) { transform: rotate(16deg) translate(3px, 1px); border-color: var(--pir); }
.ust-men:hover .ust-men-k i:nth-child(1) { transform: rotate(-22deg) translate(-4px, 1px); }
.ust-men:hover .ust-men-k i:nth-child(3) { transform: rotate(24deg) translate(5px, 1px); }
.ust-men-k.is-x i:nth-child(1) { transform: rotate(45deg) scale(.9, .1); background: currentColor; }
.ust-men-k.is-x i:nth-child(2) { transform: rotate(-45deg) scale(.9, .1); background: currentColor; }
.ust-men-k.is-x i:nth-child(3) { opacity: 0; }

/* tam ekran indeks */
.ix { position: fixed; inset: 0; width: 100%; max-width: none; height: 100dvh; max-height: none; margin: 0; padding: 0; border: 0; color: var(--mur); overflow-x: hidden; overflow-y: auto; background-color: var(--masa); background-image: var(--keten); overscroll-behavior: contain; }
.ix::backdrop { background: rgba(36, 18, 42, .3); }
.ix[open] { display: grid; grid-template-rows: auto 1fr auto; animation: ixA .14s ease-out; }
@keyframes ixA { from { opacity: 0; } }
.ix-ust { background: #fff; border-bottom: 1px solid var(--cz); position: sticky; top: 0; z-index: 2; }
.ix-g { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 0; }
.ix-kartlar { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 34px 30px; align-content: center; padding: 44px 48px; }
.ixk { --r: 0deg; position: relative; display: grid; grid-template-rows: auto auto 1fr; gap: 4px; padding: 12px 12px 18px; background: #fff; background-image: var(--kagit); text-decoration: none; box-shadow: var(--yat); transform: rotate(var(--r)); transition: transform .28s var(--kol), box-shadow .28s; animation: ixK .3s var(--kol) backwards; }
.ixk:nth-child(2) { animation-delay: .02s; } .ixk:nth-child(3) { animation-delay: .04s; } .ixk:nth-child(4) { animation-delay: .06s; }
.ixk:nth-child(5) { animation-delay: .03s; } .ixk:nth-child(6) { animation-delay: .05s; } .ixk:nth-child(7) { animation-delay: .07s; } .ixk:nth-child(8) { animation-delay: .09s; }
@keyframes ixK { from { opacity: 0; transform: rotate(0) translateY(10px); } }
.ixk:hover, .ixk:focus-visible { transform: rotate(0) translateY(-6px); box-shadow: var(--kalk); }
.ixk[aria-current] { outline: 1px solid var(--pir); outline-offset: -6px; }
.ixk-v { display: block; aspect-ratio: 4 / 3.1; overflow: hidden; background: var(--sis); margin-bottom: 10px; }
.ixk-v img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s var(--kol); }
.ixk:hover .ixk-v img { transform: scale(1.05); }
.ixk-plan { display: grid; place-items: center; height: 100%; padding: 10px; background: #fff; box-shadow: inset 0 0 0 1px var(--cz); }
.ixk-plan svg { width: 100%; height: 100%; }
.ixk-dv { display: grid; place-items: center; align-content: center; gap: 4px; height: 100%; background: var(--al2); text-align: center; }
.ixk-mono { width: 36px; height: 36px; color: var(--pir); }
.ixk-dv em { font: italic 400 26px/1 var(--fd); color: var(--pat); }
.ixk-dv em i { font: 400 13px var(--ft); color: var(--pirm); margin: 0 4px; }
.ixk-dv small { font-size: 12px; letter-spacing: .1em; color: var(--gri); }
.ixk-t { font: 400 clamp(22px, 1.9vw, 30px)/1.05 var(--fd); color: var(--pat); letter-spacing: -.01em; }
.ixk-m { font-size: 13.5px; color: var(--gri); }
.ix-tk { position: relative; padding: 40px 34px; color: #F5E9EC; background: linear-gradient(90deg, rgba(0, 0, 0, .14), transparent 12%, transparent 88%, rgba(0, 0, 0, .14)), radial-gradient(120% 50% at 50% 0%, #54305A 0%, transparent 70%), var(--pat); }
.ix-tk::before { content: ''; position: absolute; inset: 0 12px; border-left: 1px dashed rgba(217, 194, 154, .4); border-right: 1px dashed rgba(217, 194, 154, .4); pointer-events: none; }
.ix-tk-h { font: 400 32px/1.05 var(--fd); color: #fff; }
.ix-tk-p { margin: 8px 0 22px; font-size: 14.5px; line-height: 1.5; color: rgba(245, 233, 236, .72); }
.ix-ay li { display: grid; gap: 8px; padding: 14px 0; border-top: 1px solid rgba(234, 199, 199, .16); }
.ix-ay-n { font-size: 13.5px; color: rgba(245, 233, 236, .65); }
.ix-ay-n b { font: 400 20px/1 var(--fd); color: #fff; margin-right: 4px; }
.ix-alt { display: grid; gap: 6px; margin-top: 22px; font-size: 14.5px; }
.ix-alt a { color: #fff; text-decoration: none; }
.ix-alt .acik { color: rgba(245, 233, 236, .8); }
.ix-alt .acik.is-open { color: #fff; }
.ix-hz { display: flex; flex-wrap: wrap; gap: 8px 22px; align-items: baseline; padding: 18px 48px 24px; border-top: 1px solid var(--cz); background: #fff; font-size: 15px; }
.ix-hz span { color: var(--gri); font-size: 13px; }
.ix-hz a { text-decoration: none; color: var(--pat); background: linear-gradient(var(--pir), var(--pir)) 0 100% / 0 1px no-repeat; transition: background-size .25s; }
.ix-hz a:hover { background-size: 100% 1px; }
html.ix-acik { overflow: hidden; }

/* cumartesi tarihleri (indeks + footer şeridi) */
.gn { display: flex; flex-wrap: wrap; gap: 6px; }
.gn a, .gn s { display: inline-grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; font: 400 16px/1 var(--fd); font-variant-numeric: lining-nums tabular-nums; text-decoration: none; }
.gn a { color: var(--pat); background: #fff; box-shadow: inset 0 0 0 1.2px var(--pir); transition: background .15s, color .15s, transform .15s; }
.gn a:hover, .gn a:focus-visible { background: var(--pat); color: #fff; box-shadow: none; transform: translateY(-2px); }
.gn s { color: var(--gri2); text-decoration: line-through; text-decoration-color: var(--cz2); }
.gn--k a { color: var(--pat3); background: var(--pir2); box-shadow: none; }
.gn--k a:hover { background: #fff; color: var(--pat); }
.gn--k s { color: rgba(245, 233, 236, .38); text-decoration-color: rgba(245, 233, 236, .3); }

/* ---------------------------------------------------------------- footer: takvim şeridi */
.son { background: #fff; padding-top: 104px; }
.son-ust { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr) auto; gap: 36px 56px; align-items: end; padding-bottom: 44px; }
.son-h { font-size: clamp(38px, 4vw, 62px); line-height: .98; color: var(--pat); letter-spacing: -.02em; }
.son-p { color: var(--gri); font-size: 17px; max-width: 46ch; }
.son-yak { display: grid; gap: 14px; justify-items: start; }
.son-yak small { display: block; font-size: 13px; color: var(--gri); }
.son-yak b { font: 400 28px/1.1 var(--fd); color: var(--pat); }
.son-serit { padding: 30px 0 44px; }
.son-serit.keten, .son-serit { background-color: var(--masa); background-image: var(--keten); }
.son-serit-ust { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 20px; font-size: 14.5px; color: var(--gri); }
.son-serit-ust b { font: 400 22px/1 var(--fd); color: var(--pat); }
.son-ok { display: flex; gap: 8px; }
.son-aylar { display: flex; gap: 18px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding: 0 40px; padding: 10px max(40px, calc(50% - 640px)) 26px; scrollbar-width: none; }
.son-aylar::-webkit-scrollbar { display: none; }
.son-aylar:focus-visible { outline-offset: -4px; }
.son-ay { flex: 0 0 236px; scroll-snap-align: start; display: grid; grid-template-rows: auto 1fr auto; gap: 14px; padding: 18px 18px 16px; background: #fff; background-image: var(--kagit); box-shadow: var(--yat); }
.son-ay:nth-child(odd) { transform: rotate(-.5deg); }
.son-ay:nth-child(even) { transform: rotate(.45deg); }
.son-ay-h { display: flex; align-items: baseline; justify-content: space-between; border-bottom: 1px solid var(--cz); padding-bottom: 10px; }
.son-ay-h b { font: 400 26px/1 var(--fd); color: var(--pat); }
.son-ay-h span { font-size: 13px; color: var(--gri); font-variant-numeric: tabular-nums; }
.son-ay-n { font-size: 13px; color: var(--gri); }
.son-ay--dolu { background-color: #FBFAFC; }
.son-ay--dolu .son-ay-h b { color: var(--gri); }
.son-alt { display: grid; grid-template-columns: auto 1fr; gap: 18px 48px; align-items: center; padding-top: 40px; padding-bottom: 104px; }
.son-logo { text-decoration: none; }
.son-nv { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px 26px; }
.son-nv a, .son-kn a, .son-yas a { text-decoration: none; color: var(--mur); background: linear-gradient(var(--pir), var(--pir)) 0 100% / 0 1px no-repeat; transition: background-size .25s var(--kol); }
.son-nv a:hover, .son-kn a:hover, .son-yas a:hover { background-size: 100% 1px; }
.son-nv a { font-size: 15.5px; }
.son-kn, .son-yas { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 6px 26px; align-items: center; font-size: 14px; color: var(--gri); }
.son-kn { padding-top: 18px; border-top: 1px solid var(--cz); }
.son-kn .acik { font-size: 14px; }
.son-yas { font-size: 13px; }
.son-up { margin-left: auto; display: inline-flex; gap: 6px; align-items: center; border: 0; background: none; padding: 0; color: var(--pat); font-weight: 600; font-size: 13.5px; }
.son-up .ic { width: 15px; height: 15px; }

/* ---------------------------------------------------------------- iç sayfa başlığı: masa üstü */
.mz { position: relative; padding: 52px 0 46px; overflow: hidden; isolation: isolate; background-color: var(--masa); background-image: var(--keten), repeating-linear-gradient(0deg, rgba(58, 31, 61, .018) 0 1px, transparent 1px 3px), repeating-linear-gradient(90deg, rgba(58, 31, 61, .016) 0 1px, transparent 1px 3px); }
.mz-yer { position: absolute; inset: 0; z-index: -1; pointer-events: none; }
.mz-kurdele { position: absolute; right: -6%; top: -30%; width: 120px; height: 170%; transform: rotate(28deg); background: linear-gradient(90deg, #E2B9BB, #F7E2E1 42%, #DCAEB1 58%, #EAC7C7); box-shadow: 0 10px 22px -12px rgba(58, 31, 61, .35); opacity: .9; }
.mz-in { position: relative; display: grid; grid-template-columns: minmax(0, 1.02fr) minmax(0, .98fr); gap: 56px; align-items: center; }
.mz--duz .mz-in { grid-template-columns: minmax(0, 860px); }
.mz-kart { position: relative; z-index: 2; filter: drop-shadow(0 22px 24px rgba(42, 22, 48, .16)) drop-shadow(0 2px 2px rgba(42, 22, 48, .1)); transform: rotate(-.6deg); }
.mz-kart-in { position: relative; clip-path: var(--d); padding: 46px 52px 44px; background: #fff; background-image: var(--kagit); }
.mz-kart-in::before { content: ''; position: absolute; inset: 14px; border: 1px solid var(--pir2); pointer-events: none; }
.mz h1 { font-size: clamp(44px, 5.4vw, 86px); line-height: .96; letter-spacing: -.024em; color: var(--pat); }
.mz-lead { margin-top: 20px; max-width: 54ch; font-size: 18px; line-height: 1.6; color: var(--gri); }
.crumbs { display: flex; flex-wrap: wrap; gap: 6px 10px; font-size: 13.5px; color: var(--gri); margin-bottom: 22px; }
.crumbs a { text-decoration: none; }
.crumbs a:hover { color: var(--pat); }
.crumbs > * + *::before { content: ''; display: inline-block; width: 5px; height: 5px; margin-right: 10px; border-radius: 50%; background: var(--al3); vertical-align: middle; }
.mz-v { position: relative; min-height: 470px; }
.mz-b { position: absolute; display: block; padding: 12px 12px 38px; background: #fff; box-shadow: var(--yat); overflow: hidden; }
.mz-b img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s var(--kol); }
a.mz-b:hover img { transform: scale(1.04); }
.mz-b--1 { left: 4%; top: 0; width: 84%; height: 420px; transform: rotate(2deg); }
.mz-v--mo .mz-b--1 { left: 0; top: 10px; width: 62%; height: 380px; transform: rotate(-2.4deg); }
.mz-v--mo .mz-b--2 { right: 0; top: 0; width: 40%; height: 250px; transform: rotate(3.2deg); }
.mz-v--mo .mz-b--3 { right: 14%; top: 232px; width: 34%; height: 200px; transform: rotate(-1deg); z-index: 1; }
.mz-pafta { position: absolute; left: 0; top: 10px; width: 100%; padding: 26px; background: #fff; box-shadow: var(--yat); transform: rotate(-1.2deg); }
.mz-not { position: absolute; z-index: 3; right: 0; bottom: -6px; width: min(340px, 90%); display: grid; gap: 10px; padding: 24px 22px 20px; background: #fff; background-image: var(--kagit); border-radius: 3px; box-shadow: var(--kalk); transform: rotate(-1.6deg); }
.mz-v--mo .mz-not { right: auto; left: 8%; bottom: -10px; }
.mz-atac { position: absolute; left: 26px; top: -14px; width: 15px; height: 40px; border: 2px solid var(--pir); border-radius: 8px; border-bottom-color: transparent; }
.mz-atac::after { content: ''; position: absolute; left: 2px; right: 2px; top: 5px; height: 26px; border: 2px solid var(--pir); border-top-color: transparent; border-radius: 6px; }
.mz-alt { position: relative; z-index: 1; margin-top: 44px; }
.mz-k { display: flex; flex-wrap: wrap; gap: 10px 0; }
.mz-k div { display: flex; flex-direction: column-reverse; gap: 2px; padding: 0 34px 0 0; margin-right: 34px; border-right: 1px solid rgba(58, 31, 61, .14); }
.mz-k div:last-child { border-right: 0; }
.mz-k dt { font-size: 13px; color: var(--gri); }
.mz-k dd { font: 400 26px/1.1 var(--fd); color: var(--pat); font-variant-numeric: lining-nums; }
[data-kart].is-tut { box-shadow: var(--kalk) !important; cursor: grabbing; }
.ph5-tl { display: inline-flex; align-items: center; gap: 8px; font: 400 19px/1.1 var(--fd); color: var(--pat); }
.ph5-tl .ic { width: 16px; height: 16px; color: var(--pir); }
.ph5-tp { font-size: 14.5px; line-height: 1.5; color: var(--gri); }
.ph5-tp b { color: var(--mur); font-weight: 600; }
.ph5-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.ph5-chip { display: inline-grid; gap: 1px; padding: 9px 12px; border: 1px solid var(--cz); border-radius: var(--r); background: #fff; text-align: left; text-decoration: none; font-size: 14px; transition: border-color .15s, background .15s; }
.ph5-chip b { font-weight: 600; color: var(--pat); }
.ph5-chip small { font-size: 12px; color: var(--gri); }
.ph5-chip:hover, .ph5-chip[aria-pressed="true"] { border-color: var(--pat); background: var(--al2); }
.ph5-copy { display: inline-flex; align-items: center; gap: 8px; width: fit-content; }
.ph5-copy .ic { width: 16px; height: 16px; color: var(--pir); }
.ph5-copy.is-done { background: var(--al2); }
.ph5-open { font-size: 15px; font-weight: 600; }
.ph5-open::before { content: ''; display: inline-block; width: 8px; height: 8px; margin-right: 8px; border-radius: 50%; background: var(--gri2); }
.ph5-open.is-open::before { background: #5C9A72; }
.ph5-link { display: inline-flex; gap: 6px; align-items: center; font-weight: 600; font-size: 14.5px; color: var(--pat); text-decoration: none; }
.ph5-link .ic { width: 16px; height: 16px; color: var(--pir); }
.ph5-seg { display: flex; flex-wrap: wrap; gap: 0; border: 1px solid var(--cz); border-radius: var(--r); overflow: hidden; }
.ph5-seg button { flex: 1; padding: 9px 8px; border: 0; border-right: 1px solid var(--cz); background: #fff; font-size: 13.5px; font-weight: 500; }
.ph5-seg button:last-child { border-right: 0; }
.ph5-seg button[aria-pressed="true"] { background: var(--pat); color: #fff; }
.ph5-stage { font-size: 14px; line-height: 1.5; color: var(--gri); }
.ph5-stage b { display: block; font: 400 19px/1.2 var(--fd); color: var(--pat); margin-bottom: 2px; }

/* ortak plan çizimi */
.plan .pt-top { fill: #fff; stroke: var(--pat); stroke-width: 1.4; }
.plan .pt-ch circle { fill: var(--pat); }
.plan .pt--hl .pt-top { fill: var(--al2); stroke: var(--pirm); }
.plan text { font: 600 12px var(--ft); fill: var(--pat); text-anchor: middle; }
.plan .pl-floor { fill: var(--al2); stroke: var(--pir); stroke-dasharray: 4 3; }
.plan .pl-stage { fill: var(--pat); }
.plan .pl-lab { font: italic 400 14px var(--fd); fill: var(--pirm); }
.plan .pl-num { font-size: 11px; fill: var(--gri); }
.plan .pt-long { fill: none; stroke: var(--pat); stroke-width: 9; stroke-linecap: round; opacity: .14; }
.plan .pt--lg .pt-top { fill: var(--al2); stroke: var(--pat); }
.tab-i { position: absolute; bottom: -1px; left: 0; height: 2px; width: var(--w, 0); transform: translateX(var(--x, 0)); background: var(--pir); transition: transform .3s var(--kol), width .3s var(--kol); }

/* ================================================================ ANA SAYFA */
/* 1 · planlama masası */
.ms { position: relative; height: clamp(760px, calc(100svh - var(--ust)), 980px); overflow: hidden; isolation: isolate; background-color: var(--masa); background-image: var(--keten), radial-gradient(70% 60% at 50% 40%, rgba(255, 255, 255, .7), rgba(255, 255, 255, 0) 70%), repeating-linear-gradient(0deg, rgba(58, 31, 61, .018) 0 1px, transparent 1px 3px), repeating-linear-gradient(90deg, rgba(58, 31, 61, .016) 0 1px, transparent 1px 3px); }
.ms-masa { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.ms-yol { position: absolute; top: 0; bottom: 0; left: 35.5%; width: 33%; background: var(--keten), linear-gradient(90deg, rgba(0, 0, 0, .28) 0%, transparent 7%, rgba(255, 255, 255, .05) 30%, transparent 46%, rgba(255, 255, 255, .07) 64%, transparent 80%, rgba(0, 0, 0, .3) 100%), radial-gradient(60% 40% at 50% 46%, #5E3763 0%, rgba(94, 55, 99, 0) 72%), linear-gradient(180deg, #3F2243, var(--pat) 50%, #331B36); box-shadow: -10px 0 26px -16px rgba(42, 22, 48, .55), 10px 0 26px -16px rgba(42, 22, 48, .55); }
.ms-yol-dikis { position: absolute; top: 0; bottom: 0; left: calc(35.5% + 12px); width: calc(33% - 24px); border-left: 1px dashed rgba(217, 194, 154, .55); border-right: 1px dashed rgba(217, 194, 154, .55); }
.ms-kurdele { position: absolute; inset: 0; z-index: 1; width: 100%; height: 100%; pointer-events: none; filter: drop-shadow(0 8px 8px rgba(58, 31, 61, .18)); }
.kd-g { fill: none; stroke: url(#kd-g); stroke-width: 20; stroke-linecap: butt; }
.kd-l { fill: none; stroke: rgba(255, 255, 255, .55); stroke-width: 1; stroke-dasharray: 2 5; transform: translateY(-6px); }
.ms-maket { position: absolute; z-index: 2; left: 31%; width: 42%; top: 3%; height: 90%; pointer-events: none; }
.ms-maket canvas, .ms-maket .mk-poster { position: absolute; inset: 0; width: 100%; height: 100%; }
.mk-poster { object-fit: contain; object-position: 50% 52%; }
.ms-maket canvas { opacity: 0; }
.ms-maket::after { content: ''; position: absolute; z-index: -1; left: 12%; right: 12%; top: 34%; bottom: 18%; border-radius: 50%; background: radial-gradient(closest-side, rgba(20, 8, 24, .55), rgba(20, 8, 24, 0)); filter: blur(12px); }
.ms-isimlik { position: absolute; z-index: 3; left: 0; top: 0; display: none; padding: 7px 12px 8px; background: #fff; border-radius: 2px; box-shadow: var(--yat); text-align: center; line-height: 1.1; transform: translate(14px, -112%) rotate(-3deg); pointer-events: none; }
.ms-isimlik::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 40%; background: linear-gradient(180deg, rgba(58, 31, 61, .06), transparent); }
.ms-isimlik b { display: block; font: italic 400 17px/1 var(--fd); color: var(--pat); }
.ms-isimlik small { font-size: 11px; color: var(--gri); }
.ms.has-cagri .ms-isimlik { display: block; }
.kt { --r: 0deg; position: absolute; transform: rotate(var(--r)); }
.kt[data-kart] { touch-action: none; }
.kt-dv { z-index: 4; left: max(28px, 3.6vw); top: 7%; width: clamp(420px, 34vw, 540px); filter: drop-shadow(0 26px 26px rgba(42, 22, 48, .2)) drop-shadow(0 2px 2px rgba(42, 22, 48, .12)); cursor: grab; }
.kt-dv-in { position: relative; display: grid; justify-items: center; text-align: center; gap: 0; padding: 50px 52px 40px; background: #fff; background-image: var(--kagit); }
.kt-dv-in::before, .kt-dv-in::after { content: ''; position: absolute; pointer-events: none; }
.kt-dv-in::before { inset: 16px; border: 1px solid var(--pir2); }
.kt-dv-in::after { inset: 21px; border: 1px solid rgba(217, 194, 154, .45); }
.kt-dv-mono { width: 54px; height: 54px; color: var(--pir); }
.kt-dv-k { margin-top: 12px; font-size: 12.5px; letter-spacing: .16em; color: var(--pirm); }
.kt-dv-h { margin-top: 18px; font: 400 clamp(64px, 5.9vw, 94px)/.92 var(--fd); letter-spacing: -.035em; color: var(--pat); text-wrap: initial; }
.kt-dv-p { margin-top: 22px; max-width: 34ch; font-size: 16.5px; line-height: 1.55; color: var(--gri); }
.kt-dv-a { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 4px 12px; margin-top: 24px; padding-top: 18px; border-top: 1px solid var(--cz); font-size: 13px; color: var(--mur); }
.kt-dv-a i { width: 4px; height: 4px; border-radius: 50%; background: var(--pir); }
.kt-pl { z-index: 5; right: max(24px, 3.2vw); top: 6%; width: clamp(350px, 26vw, 396px); display: grid; gap: 14px; padding: 0 22px 22px; background: #fff; border-radius: 6px; box-shadow: var(--yat); }
.kt-pl::before { content: ''; position: absolute; left: 50%; top: -9px; width: 64px; height: 18px; margin-left: -32px; border-radius: 3px; background: linear-gradient(180deg, #D8BE90, var(--pir) 60%, #93743F); box-shadow: 0 3px 6px -2px rgba(42, 22, 48, .4); }
.kt-pl-tut { display: flex; align-items: center; justify-content: space-between; margin: 0 -22px; padding: 22px 22px 14px; border-bottom: 1px solid var(--cz); cursor: grab; }
.kt-pl-tt { font: 400 24px/1 var(--fd); color: var(--pat); }
.kt-pl-gr { width: 16px; height: 10px; background: radial-gradient(circle, var(--cz2) 1.2px, transparent 1.6px) 0 0 / 5.33px 5px; }
.kt-baski { z-index: 1; left: 30%; bottom: -34px; width: 248px; padding: 10px 10px 14px; background: #fff; text-decoration: none; box-shadow: var(--yat); }
.kt-baski-f { display: block; aspect-ratio: 5 / 4; overflow: hidden; background: var(--sis); }
.kt-baski-f img { width: 100%; height: 100%; object-fit: cover; }
.kt-baski-y { display: block; margin-top: 10px; font: italic 400 15px/1.2 var(--fd); color: var(--pat); }
.kt-kumas { z-index: 1; left: 57%; top: -24px; width: 214px; padding: 34px 16px 14px; background: #fff; box-shadow: var(--yat); }
.kt-kumas-h { font-size: 11.5px; letter-spacing: .08em; color: var(--gri); margin-bottom: 10px; }
.kt-kumas ul { display: grid; gap: 8px; }
.km { display: grid; grid-template-columns: 54px 1fr; grid-template-rows: auto auto; column-gap: 10px; align-items: center; }
.km i { grid-row: 1 / 3; height: 36px; clip-path: polygon(0 0, calc(100% - 5px) 0.00%, 100% 8.33%, calc(100% - 5px) 16.67%, 100% 25.00%, calc(100% - 5px) 33.33%, 100% 41.67%, calc(100% - 5px) 50.00%, 100% 58.33%, calc(100% - 5px) 66.67%, 100% 75.00%, calc(100% - 5px) 83.33%, 100% 91.67%, calc(100% - 5px) 100.00%, 0 100%); }
.km b { font-size: 12.5px; font-weight: 600; color: var(--mur); line-height: 1.15; }
.km small { font-size: 11px; color: var(--gri); }
.km--kadife i { background: radial-gradient(80% 90% at 30% 20%, #6A4070, var(--pat) 60%, #26122B); }
.km--ipek i { background: linear-gradient(115deg, #E2B6B8, #FBEAE8 40%, #DCADB0 60%, #F2D3D2); }
.km--keten i { background: var(--keten), repeating-linear-gradient(90deg, rgba(0, 0, 0, .05) 0 1px, transparent 1px 3px), #F5F2EE; }
.km--pirinc i { height: 14px; margin: 11px 0; background: linear-gradient(180deg, #E4CC9E, var(--pir) 55%, #8E7040); }
.kt-liste { z-index: 1; left: auto; right: 5%; bottom: -128px; width: 318px; padding: 18px 20px 30px; background: #fff; box-shadow: var(--yat); background-image: repeating-linear-gradient(180deg, transparent 0 27px, rgba(176, 141, 87, .22) 27px 28px); background-position: 0 50px; }
.kt-liste-h { display: flex; justify-content: space-between; align-items: baseline; padding-bottom: 12px; margin-bottom: 4px; border-bottom: 1px solid var(--al3); }
.kt-liste-h b { font: 400 20px/1 var(--fd); color: var(--pat); }
.kt-liste-h span { font-size: 12px; color: var(--gri); }
.kt-liste-h em { font-style: normal; font-weight: 600; color: var(--pat); font-variant-numeric: tabular-nums; }
.kt-liste li { display: grid; grid-template-columns: 1fr 22px 70px; gap: 8px; height: 28px; align-items: center; font-size: 13px; color: var(--mur); }
.kt-liste li small { text-align: center; color: var(--gri); }
.kt-liste li b { font-weight: 500; font-size: 12px; color: var(--pirm); text-align: right; }
.kt-liste li.no span { text-decoration: line-through; color: var(--gri2); }
.ms-ipucu { position: absolute; z-index: 1; left: max(28px, 3.6vw); top: 20px; font: italic 400 15px/1 var(--fd); color: var(--gri); }
.ms-ipucu::before { content: ''; display: inline-block; width: 26px; height: 1px; margin-right: 10px; vertical-align: middle; background: var(--pir); }
.ms.has-gl .ms-maket canvas { opacity: 1; transition: opacity .5s; }
.ms.has-gl .ms-maket .mk-poster { opacity: 0; transition: opacity .5s; }

/* widget (planlama kartı) */
.hw-l { font-size: 14.5px; line-height: 1.5; color: var(--gri); }
.hw-v { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; border: 0; margin: 0; padding: 0; }
.hw-v label { position: relative; }
.hw-v input, .hw-t input { position: absolute; opacity: 0; pointer-events: none; }
.hw-v span { display: grid; justify-items: center; gap: 3px; padding: 10px 4px 9px; border: 1px solid var(--cz); border-radius: var(--r); cursor: pointer; transition: border-color .15s, background .15s, box-shadow .2s; text-align: center; }
.hw-v svg { width: 26px; height: 26px; fill: none; stroke: var(--pat); stroke-width: 1.3; stroke-linecap: round; stroke-linejoin: round; }
.hw-v b { font-size: 14px; font-weight: 600; line-height: 1.1; }
.hw-v small { font-size: 11px; color: var(--gri); line-height: 1.1; }
.hw-v input:checked + span { border-color: var(--pat); background: var(--al2); box-shadow: inset 0 0 0 1px var(--pat); }
.hw-v input:focus-visible + span { outline: 2px solid var(--pir); outline-offset: 2px; }
.hw-gl { display: flex; align-items: center; justify-content: space-between; }
.hw-gl label { font-size: 13.5px; color: var(--gri); }
.hw-gs { display: flex; align-items: center; gap: 4px; }
.hw-gs button { width: 34px; height: 34px; display: grid; place-items: center; border: 1px solid var(--cz); border-radius: var(--r); background: #fff; color: var(--pat); }
.hw-gs button:hover { border-color: var(--pat); }
.hw-gs output { min-width: 78px; text-align: center; font-size: 40px; line-height: 1; color: var(--pat); }
.rng { --f: 50%; width: 100%; height: 28px; margin: 4px 0 0; background: transparent; -webkit-appearance: none; appearance: none; cursor: pointer; }
.rng::-webkit-slider-runnable-track { height: 3px; border-radius: 3px; background: linear-gradient(90deg, var(--pat) var(--f), var(--cz) var(--f)); }
.rng::-moz-range-track { height: 3px; border-radius: 3px; background: linear-gradient(90deg, var(--pat) var(--f), var(--cz) var(--f)); }
.rng::-webkit-slider-thumb { -webkit-appearance: none; width: 22px; height: 22px; margin-top: -9.5px; border-radius: 50%; background: #fff; border: 1.5px solid var(--pat); box-shadow: 0 0 0 4px rgba(176, 141, 87, .22), var(--g1); }
.rng::-moz-range-thumb { width: 20px; height: 20px; border-radius: 50%; background: #fff; border: 1.5px solid var(--pat); box-shadow: 0 0 0 4px rgba(176, 141, 87, .22); }
.hw-t { position: relative; display: flex; border-bottom: 1px solid var(--cz); }
.hw-t label { flex: 1; text-align: center; }
.hw-t span { display: block; padding: 6px 0 9px; font-size: 14.5px; font-weight: 500; color: var(--gri); cursor: pointer; }
.hw-t input:checked + span { color: var(--pat); font-weight: 600; }
.hw-t input:focus-visible + span { outline: 2px solid var(--pir); }
.hw-ti { position: absolute; bottom: -1px; left: 0; height: 2px; width: var(--w, 33%); transform: translateX(var(--x, 0)); background: var(--pir); transition: transform .3s var(--kol), width .3s; }
.hw-o { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.hw-o div { display: flex; flex-direction: column-reverse; gap: 2px; }
.hw-o dt { font-size: 11.5px; color: var(--gri); line-height: 1.2; }
.hw-o dd { font: 400 23px/1 var(--fd); color: var(--pat); font-variant-numeric: lining-nums tabular-nums; }
.hw-not { font-size: 13px; color: var(--pirm); }
.hw-not:empty { display: none; }
.hw-a { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 18px; }

/* 2 · sekmeli tek ekran */
.sk { padding: 92px 0 40px; background: #fff; }
.sk-tabs { position: relative; display: flex; gap: 0 46px; border-bottom: 1px solid var(--cz); overflow-x: auto; scrollbar-width: none; }
.sk-tabs::-webkit-scrollbar { display: none; }
.sk-tab { flex: none; display: grid; gap: 2px; padding: 0 0 18px; border: 0; background: none; text-align: left; color: var(--gri); }
.sk-tab span { font: 400 clamp(24px, 2.3vw, 34px)/1.05 var(--fd); letter-spacing: -.012em; transition: color .2s; }
.sk-tab small { font-size: 13px; color: var(--gri2); }
.sk-tab:hover span { color: var(--pat); }
.sk-tab.on span { color: var(--pat); }
.sk-tab.on small { color: var(--pirm); }
.sk-p { padding-top: 48px; min-height: 660px; }
.sk-p:not([hidden]) { animation: skA .32s var(--kol); }
@keyframes skA { from { opacity: 0; transform: translateY(8px); } }
.sk-p:focus-visible { outline-offset: 8px; }
.masa-alan { position: relative; border-radius: var(--rk); overflow: hidden; background-color: var(--masa); background-image: var(--keten), repeating-linear-gradient(0deg, rgba(58, 31, 61, .018) 0 1px, transparent 1px 3px), repeating-linear-gradient(90deg, rgba(58, 31, 61, .016) 0 1px, transparent 1px 3px); }

/* hizmetler */
.sh { display: grid; grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr); grid-template-rows: 1fr auto; gap: 26px 64px; }
.sh-l { grid-row: 1; border-top: 1px solid var(--cz); align-self: start; }
.sh-l a { display: grid; grid-template-columns: 1fr auto; align-items: baseline; gap: 2px 14px; padding: 17px 2px 16px; border-bottom: 1px solid var(--cz); text-decoration: none; transition: padding .25s var(--kol); }
.sh-n { font: 400 clamp(24px, 2.2vw, 32px)/1.1 var(--fd); color: var(--gri); transition: color .2s; }
.sh-w { font-size: 13.5px; color: var(--pirm); white-space: nowrap; font-variant-numeric: tabular-nums; }
.sh-s { grid-column: 1 / -1; font-size: 15px; color: var(--gri); line-height: 1.45; max-height: 0; overflow: hidden; opacity: 0; transition: max-height .3s var(--kol), opacity .3s; }
.sh-l a:hover .sh-n, .sh-l a[aria-current="true"] .sh-n { color: var(--pat); }
.sh-l a[aria-current="true"] { padding-left: 14px; box-shadow: inset 2px 0 0 var(--pir); }
.sh-l a[aria-current="true"] .sh-s { max-height: 3.2em; opacity: 1; }
.sh-masa { grid-row: 1 / 3; grid-column: 2; position: relative; min-height: 600px; border-radius: var(--rk); overflow: hidden; background-color: var(--masa); background-image: var(--keten); }
.sh-f { position: absolute; inset: 0; margin: 0; opacity: 0; visibility: hidden; transition: opacity .4s var(--kol), visibility 0s .4s; }
.sh-f.on { opacity: 1; visibility: visible; transition: opacity .4s var(--kol); }
.sh-baski { position: absolute; left: 7%; top: 7%; width: 72%; height: 74%; padding: 14px 14px 46px; background: #fff; box-shadow: var(--yat); transform: rotate(-1.6deg) translateY(10px); transition: transform .6s var(--kol); }
.sh-f.on .sh-baski { transform: rotate(-1.6deg); }
.sh-baski img { width: 100%; height: 100%; object-fit: cover; }
.sh-not { position: absolute; right: 5%; bottom: 6%; width: min(380px, 52%); display: grid; gap: 10px; padding: 24px 24px 20px; background: #fff; background-image: var(--kagit); border-radius: 3px; box-shadow: var(--kalk); transform: rotate(1.8deg) translateY(16px); transition: transform .6s .05s var(--kol); font-size: 14.5px; color: var(--gri); }
.sh-f.on .sh-not { transform: rotate(1.8deg); }
.sh-not > b { font: 400 23px/1.1 var(--fd); color: var(--pat); }
.sh-not ul li { position: relative; padding: 3px 0 3px 18px; line-height: 1.4; }
.sh-not ul li::before { content: ''; position: absolute; left: 2px; top: .72em; width: 7px; height: 7px; border-radius: 50%; border: 1.2px solid var(--pir); }
.sh-not ol { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; margin-top: 4px; }
.sh-not ol li { font-size: 11.5px; line-height: 1.3; padding-top: 8px; border-top: 2px solid var(--al); color: var(--mur); }
.sh-not ol li:first-child { border-color: var(--pir); }
.sh-not ol li span { display: block; font-weight: 600; color: var(--pirm); margin-bottom: 2px; }
.sh-a { grid-row: 2; display: flex; flex-wrap: wrap; gap: 14px 24px; align-items: center; align-self: end; }

/* mekânlar */
.sm { display: grid; grid-template-columns: minmax(0, 1.18fr) minmax(0, .82fr); gap: 64px; align-items: stretch; }
.sm-masa { position: relative; min-height: 600px; border-radius: var(--rk); overflow: hidden; background-color: var(--masa); background-image: var(--keten); }
.sm-f { position: absolute; inset: 0; margin: 0; opacity: 0; visibility: hidden; transition: opacity .35s var(--kol), visibility 0s .35s; }
.sm-f.on { opacity: 1; visibility: visible; transition: opacity .35s var(--kol); }
.sm-baski { position: absolute; left: 6%; right: 9%; top: 7%; bottom: 15%; padding: 14px; background: #fff; box-shadow: var(--yat); transform: rotate(1.1deg); }
.sm-baski img { width: 100%; height: 100%; object-fit: cover; }
.sm-f figcaption { position: absolute; left: 10%; bottom: 6%; display: grid; gap: 2px; padding: 16px 20px 15px; background: #fff; background-image: var(--kagit); border-radius: 2px; box-shadow: var(--kalk); transform: rotate(-1.4deg); font-size: 13.5px; color: var(--gri); max-width: 78%; }
.sm-f figcaption b { font: 400 26px/1.1 var(--fd); color: var(--pat); }
.sm-t { display: grid; align-content: start; gap: 6px; }
.sm-k { font-size: 15px; color: var(--gri); }
.sm-gv { display: flex; align-items: baseline; gap: 16px; }
.sm-gv output { font-size: 86px; line-height: .95; color: var(--pat); letter-spacing: -.03em; }
.sm-gv span { font-size: 15px; color: var(--gri); }
.sm-gv b { color: var(--pat); font-weight: 600; }
.sm-l { margin: 18px 0 18px; border-top: 1px solid var(--cz); min-height: 300px; }
.sm-l a { display: grid; grid-template-columns: 1fr auto; gap: 0 14px; align-items: baseline; padding: 11px 2px; border-bottom: 1px solid var(--cz); text-decoration: none; transition: padding .2s var(--kol); }
.sm-l a b { font: 400 20px/1.2 var(--fd); color: var(--pat); }
.sm-l a span { font-size: 13px; color: var(--gri); font-variant-numeric: tabular-nums; text-align: right; }
.sm-l a:hover, .sm-l a.on { padding-left: 12px; box-shadow: inset 2px 0 0 var(--pir); }
.sm-l li.bos { padding: 14px 0; font-size: 14.5px; color: var(--gri); }
.sm-not { font-size: 12.5px; color: var(--gri2); margin-top: 10px; }

/* oturma planı */
.sp { display: grid; grid-template-columns: minmax(0, 1.18fr) minmax(0, .82fr); gap: 64px; align-items: stretch; }
.sp-masa { position: relative; display: grid; grid-template-rows: 1fr auto; gap: 18px; padding: 38px 36px 28px; border-radius: var(--rk); background-color: var(--masa); background-image: var(--keten); }
.sp-pafta { position: relative; padding: 26px 30px 40px; background: #fff; background-image: var(--kagit); box-shadow: var(--yat); transform: rotate(-.8deg); min-height: 400px; display: grid; align-items: center; }
.sp-svg { grid-area: 1 / 1; opacity: 0; visibility: hidden; transition: opacity .3s, visibility 0s .3s; }
.sp-svg.on { opacity: 1; visibility: visible; transition: opacity .3s; }
.sp-svg svg { width: 100%; height: auto; max-height: 440px; }
.sp-olcek { position: absolute; right: 26px; bottom: 14px; display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--gri); }
.sp-olcek i { width: 60px; height: 6px; border: 1px solid var(--gri2); border-top: 0; }
.sp-sec { display: flex; flex-wrap: wrap; gap: 8px; }
.sp-b { padding: 10px 14px; border: 1px solid rgba(58, 31, 61, .16); border-radius: var(--r); background: rgba(255, 255, 255, .7); font-size: 14px; font-weight: 500; color: var(--mur); transition: background .15s, border-color .15s; }
.sp-b:hover { border-color: var(--pat); }
.sp-b[aria-pressed="true"] { background: var(--pat); border-color: var(--pat); color: #fff; }
.sp-t { display: grid; align-content: space-between; gap: 36px; }
.sp-k div { display: grid; grid-template-columns: 150px 1fr; gap: 18px; align-items: baseline; padding: 22px 0; border-bottom: 1px solid var(--cz); }
.sp-k div:first-child { border-top: 1px solid var(--cz); }
.sp-k dt { font: 400 46px/1 var(--fd); color: var(--pat); letter-spacing: -.02em; font-variant-numeric: lining-nums; }
.sp-k dd { font-size: 15.5px; color: var(--gri); line-height: 1.5; }
.sp-a { display: flex; flex-wrap: wrap; gap: 14px 22px; align-items: center; }

/* davetiyeden geceye */
.sg { display: grid; grid-template-columns: minmax(0, 1.18fr) minmax(0, .82fr); gap: 64px; align-items: stretch; }
.sg-sahne { --g1: #FBF7F6; --g2: #F3EAEA; --g3: #EEE4E7; position: relative; min-height: 600px; border-radius: var(--rk); overflow: hidden; background: radial-gradient(90% 70% at 50% 108%, var(--g3) 0%, transparent 65%), linear-gradient(180deg, var(--g1) 0%, var(--g2) 100%); box-shadow: inset 0 0 0 1px rgba(58, 31, 61, .06); }
.dg-yuva { position: absolute; inset: 0; }
.dg-yuva canvas, .dg-yuva .mk-poster { position: absolute; inset: 0; width: 100%; height: 100%; }
.dg-yuva .mk-poster { object-fit: cover; transition: opacity .3s; }
.dg-p2 { opacity: var(--gece, 0); }
.sg.has-gl .dg-yuva .mk-poster { visibility: hidden; }
.dg-et { position: absolute; z-index: 3; left: 0; top: 0; display: none; padding: 7px 12px 8px; background: #fff; border-radius: 2px; box-shadow: var(--yat); text-align: center; line-height: 1.1; transform: translate(14px, -112%) rotate(-3deg); }
.dg-et b { display: block; font: italic 400 17px/1 var(--fd); color: var(--pat); }
.dg-et small { font-size: 11px; color: var(--gri); }
.sg.has-et .dg-et { display: block; }
.dg-lj { position: absolute; z-index: 3; left: 18px; bottom: 16px; padding: 8px 12px; background: rgba(255, 255, 255, .94); border-radius: 2px; font-size: 13px; color: var(--mur); box-shadow: var(--g1); opacity: var(--plan, 0); transition: opacity .3s; }
.sg-t { display: grid; align-content: space-between; gap: 30px; }
.sg-ad li { border-bottom: 1px solid var(--cz); }
.sg-ad li:first-child { border-top: 1px solid var(--cz); }
.sg-ad button { display: grid; grid-template-columns: 120px 1fr; gap: 14px; align-items: baseline; width: 100%; padding: 18px 2px 16px; border: 0; background: none; text-align: left; }
.sg-w { font-size: 13px; color: var(--pirm); }
.sg-ad b { font: 400 clamp(24px, 2.2vw, 32px)/1.1 var(--fd); color: var(--gri); transition: color .2s; }
.sg-ad li.on b, .sg-ad button:hover b { color: var(--pat); }
.sg-ad p { max-height: 0; overflow: hidden; opacity: 0; padding-left: 136px; font-size: 15px; line-height: 1.5; color: var(--gri); transition: max-height .35s var(--kol), opacity .3s, padding .3s; }
.sg-ad li.on p { max-height: 7em; opacity: 1; padding-bottom: 18px; }
.sg-oyna { display: grid; grid-template-columns: 52px 1fr; gap: 18px; align-items: center; }
.sg-play { width: 52px; height: 52px; display: grid; place-items: center; border: 0; border-radius: 50%; background: var(--pat); color: #fff; box-shadow: 0 12px 24px -12px rgba(58, 31, 61, .7); transition: transform .15s; }
.sg-play:active { transform: scale(.96); }
.sg-play .ic { width: 20px; height: 20px; fill: currentColor; stroke: none; }
.sg-play .i-pause { display: none; fill: none; stroke: currentColor; stroke-width: 2.4; }
.sg-play.is-on .i-play { display: none; }
.sg-play.is-on .i-pause { display: block; }
.sg-saat { display: flex; align-items: baseline; gap: 14px; }
.sg-saat b { font: 400 40px/1 var(--fd); color: var(--pat); font-variant-numeric: lining-nums tabular-nums; letter-spacing: -.02em; min-width: 3.2em; }
.sg-saat span { font-size: 14.5px; color: var(--gri); }
.sg-alt { display: flex; flex-wrap: wrap; gap: 14px 22px; align-items: center; }

/* zarf */
.zarf { --ac: 0; --cik: 0; --git: 0; position: absolute; left: 50%; top: 54%; width: min(64%, 500px); aspect-ratio: 1.45; transform: translate(-50%, -50%) translateY(calc(var(--git) * 120%)) scale(calc(1 - var(--git) * .25)); opacity: calc(1 - var(--git) * 1.4); perspective: 1400px; pointer-events: none; }
.zarf-arka, .zarf-on, .zarf-kapak { position: absolute; inset: 0; }
.zarf-arka { background: #E9D2D2; border-radius: 4px; box-shadow: 0 30px 60px -30px rgba(58, 31, 61, .45); }
.zarf-on { background: linear-gradient(160deg, #F3E1E1, #E8CFCF); clip-path: polygon(0 0, 50% 52%, 100% 0, 100% 100%, 0 100%); border-radius: 4px; z-index: 3; }
.zarf-on::after { content: ''; position: absolute; inset: 0; background: linear-gradient(20deg, transparent 49.6%, rgba(58, 31, 61, .08) 50%, transparent 50.4%), linear-gradient(-20deg, transparent 49.6%, rgba(58, 31, 61, .08) 50%, transparent 50.4%); }
.zarf-kapak { z-index: calc(4 - var(--ust-k, 0) * 3); transform-origin: 50% 0; transform: rotateX(calc(var(--ac) * 178deg)); background: linear-gradient(180deg, #EFD9D9, #E4C7C7); clip-path: polygon(0 0, 100% 0, 50% 58%); }
.zarf-muhur { position: absolute; left: 50%; top: 40%; width: 58px; height: 58px; margin-left: -29px; display: grid; place-items: center; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #5E3560, var(--pat) 70%); box-shadow: 0 6px 12px -4px rgba(36, 18, 42, .6), inset 0 0 0 3px rgba(176, 141, 87, .55); opacity: calc(1 - var(--ac) * 3); }
.muhur-mono { width: 34px; height: 34px; color: var(--pir2); }
.zarf-kart { position: absolute; left: 6%; right: 6%; top: 5%; height: 108%; z-index: 2; display: grid; justify-items: center; align-content: center; gap: 10px; padding: 24px; background: #fff; text-align: center; transform: translateY(calc(var(--cik) * -64%)); box-shadow: 0 20px 40px -24px rgba(58, 31, 61, .4); }
.zarf-mono { width: 44px; height: 44px; color: var(--pir); }
.zk-a { font-size: 12.5px; color: var(--gri); line-height: 1.5; }
.zk-n { font: italic 400 clamp(30px, 3vw, 44px)/1 var(--fd); color: var(--pat); display: flex; align-items: baseline; gap: 12px; }
.zk-n span { font: 400 14px var(--ft); font-style: normal; color: var(--pirm); }
.zk-d { font-size: 13px; color: var(--mur); line-height: 1.5; letter-spacing: .02em; }

/* portfolyo şeridi */
.sx { position: relative; }
.sx-vp { overflow: hidden; margin: 0 -40px; padding: 34px 40px 40px; border-radius: var(--rk); background-color: var(--masa); background-image: var(--keten); cursor: grab; }
.sx-vp:active { cursor: grabbing; }
.sx-tr { display: flex; gap: 34px; touch-action: pan-y pinch-zoom; }
.sx-s { --r: 0deg; flex: 0 0 min(372px, 76vw); transform: rotate(var(--r)); }
.sx-s:last-child { margin-right: 40px; }
.sx-s a { display: grid; gap: 14px; padding: 12px 12px 18px; background: #fff; text-decoration: none; box-shadow: var(--yat); transition: box-shadow .3s, transform .3s var(--kol); }
.sx-s a:hover { box-shadow: var(--kalk); transform: translateY(-4px); }
.sx-f { position: relative; display: block; aspect-ratio: 4 / 4.6; overflow: hidden; background: var(--sis); }
.sx-f img { width: 100%; height: 100%; object-fit: cover; transition: transform 1s var(--kol); }
.sx-s a:hover .sx-f img { transform: scale(1.04); }
.sx-pl { position: absolute; right: 10px; bottom: 10px; width: 46%; padding: 8px; background: rgba(255, 255, 255, .96); box-shadow: var(--g2); opacity: 0; transform: translateY(8px); transition: opacity .3s, transform .3s var(--kol); }
.sx-s a:hover .sx-pl, .sx-s a:focus-visible .sx-pl { opacity: 1; transform: none; }
.sx-m { display: grid; gap: 4px; padding: 0 4px; }
.sx-k { font-size: 12.5px; color: var(--pirm); }
.sx-m > b { font: 400 26px/1.08 var(--fd); color: var(--pat); }
.sx-y { font-size: 13.5px; color: var(--gri); }
.sx-pal { display: flex; margin-top: 6px; }
.sx-pal i { width: 20px; height: 20px; border-radius: 50%; margin-right: -5px; box-shadow: 0 0 0 2px #fff; }
.sx-ft { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 24px; margin-top: 26px; }
.sx-nav { display: flex; gap: 8px; }
.sx-dots { display: flex; gap: 6px; margin-right: auto; }
.sx-dots i { width: 22px; height: 2px; background: var(--cz2); transition: background .2s, width .3s; }
.sx-dots i.on { width: 44px; background: var(--pat); }

/* ---------------------------------------------------------------- duyarlı */
@media (max-width: 1280px) {
  .ix-kartlar { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 26px 24px; padding: 34px 36px; }
  .ix-g { grid-template-columns: minmax(0, 1fr) 340px; }
  .kt-dv { width: clamp(380px, 33vw, 440px); }
  .kt-dv-h { font-size: clamp(56px, 5.6vw, 76px); }
  .kt-dv-in { padding: 42px 40px 34px; }
  .kt-liste { display: none; }
}
@media (max-width: 1100px) {
  .ust-in, .ix-ust { padding: 0 24px; }
  .wrap, .wrap-n { padding: 0 24px; }
  .ix-g { grid-template-columns: 1fr; }
  .ix-kartlar { padding: 28px 24px; }
  /* masa: akışa döner, kartlar üst üste */
  .ms { height: auto; padding: 28px 0 40px; display: grid; justify-items: center; gap: 0; }
  .ms-yol, .ms-yol-dikis { display: none; }
  .ms-maket { background: linear-gradient(180deg, rgba(0,0,0,.22), transparent 8%, transparent 92%, rgba(0,0,0,.24)), radial-gradient(60% 50% at 50% 50%, #5E3763, rgba(94,55,99,0) 72%), var(--pat); box-shadow: inset 0 12px 0 -11px rgba(217,194,154,.6), inset 0 -12px 0 -11px rgba(217,194,154,.6); } .ms-maket::after { display: none; }
  .kt { position: relative; left: auto !important; right: auto !important; top: auto !important; bottom: auto !important; }
  .kt-dv { order: 1; z-index: 4; margin-bottom: -44px; width: min(560px, calc(100% - 48px)); }
  .ms-maket { order: 2; position: relative; left: auto; top: auto; width: 100%; height: 470px; margin-top: 8px; }
  .kt-pl { order: 3; width: min(560px, calc(100% - 48px)); margin-top: -34px; }
  .kt-kumas, .kt-baski, .ms-kurdele, .ms-ipucu { display: none; }
  .ms-isimlik { display: none !important; }
  .sh, .sm, .sp, .sg { grid-template-columns: 1fr; gap: 30px; }
  .sh-masa { grid-column: 1; grid-row: auto; min-height: 520px; }
  .sh-a { grid-row: auto; }
  .sk-p { min-height: 0; }
  .son-ust { grid-template-columns: 1fr; gap: 20px; }
  .son-alt { grid-template-columns: 1fr; }
  .son-nv { justify-content: flex-start; }
  .mz-in { grid-template-columns: 1fr; gap: 34px; }
  .mz-kurdele { right: -30%; }
}
@media (max-width: 700px) {
  :root { --ust: 66px; }
  body { font-size: 16.5px; }
  .wrap, .wrap-n { padding: 0 16px; }
  .ust-in, .ix-ust { grid-template-columns: 1fr auto; gap: 10px; padding: 0 16px; }
  .ust-cta { display: none; }
  .logo .mono { width: 34px; height: 34px; }
  .logo .wm { height: 20px; }
  .logo-t { display: none; }
  .ust-men { height: 42px; padding: 0 14px 0 12px; font-size: 18px; }
  .ix-kartlar { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 14px; padding: 22px 16px; }
  .ixk { padding: 8px 8px 12px; }
  .ixk-t { font-size: 20px; }
  .ixk-m { font-size: 12px; }
  .ix-tk { padding: 30px 24px; }
  .ix-hz { padding: 16px; font-size: 14px; }
  .gn a, .gn s { width: 34px; height: 34px; font-size: 15px; }
  .ms { padding: 18px 0 32px; }
  .kt-dv { width: calc(100% - 32px); }
  .kt-dv-in { padding: 34px 26px 28px; }
  .kt-dv-in::before { inset: 10px; } .kt-dv-in::after { inset: 14px; }
  .kt-dv-mono { width: 42px; height: 42px; }
  .kt-dv-h { font-size: clamp(48px, 14vw, 64px); margin-top: 12px; }
  .kt-dv-p { font-size: 15.5px; margin-top: 16px; }
  .kt-dv-a { font-size: 12px; gap: 4px 8px; }
  .ms-maket { height: 380px; }
  .kt-pl { width: calc(100% - 32px); padding: 0 16px 18px; }
  .kt-pl-tut { margin: 0 -16px; padding: 20px 16px 12px; }
  .hw-v { gap: 5px; }
  .hw-v span { padding: 8px 2px; }
  .hw-v small { display: none; }
  .hw-o { grid-template-columns: repeat(2, 1fr); row-gap: 12px; }
  .hw-gs output { font-size: 34px; min-width: 64px; }
  .sk { padding: 64px 0 64px; }
  .sk-tabs { gap: 0 26px; margin: 0 -16px; padding: 0 16px; }
  .sk-tab span { font-size: 22px; }
  .sk-p { padding-top: 30px; }
  .sh-masa, .sm-masa { min-height: 420px; }
  .sh-baski { left: 5%; width: 84%; height: 62%; padding: 8px 8px 26px; }
  .sh-not { left: 6%; right: 6%; width: auto; bottom: 4%; padding: 18px 16px 14px; }
  .sh-not ol { display: none; }
  .sm-baski { left: 5%; right: 5%; top: 5%; bottom: 22%; padding: 8px; }
  .sm-f figcaption { left: 6%; right: 6%; max-width: none; }
  .sm-gv output { font-size: 64px; }
  .sp-masa { padding: 22px 16px 18px; }
  .sp-pafta { padding: 14px; min-height: 0; }
  .sp-k div { grid-template-columns: 100px 1fr; }
  .sp-k dt { font-size: 34px; }
  .sg-sahne { min-height: 420px; }
  .sg-ad button { grid-template-columns: 1fr; gap: 2px; }
  .sg-ad p { padding-left: 2px; }
  .zarf { width: 80%; }
  .zk-n { font-size: 26px; }
  .zarf-kart { gap: 6px; padding: 14px; }
  .zarf-mono { width: 30px; height: 30px; }
  .zk-a { font-size: 10.5px; }
  .zk-d { font-size: 11px; }
  .sx-vp { margin: 0 -16px; padding: 22px 16px 28px; border-radius: 0; }
  .sx-pl { opacity: 1; transform: none; width: 40%; }
  .son { padding-top: 72px; }
  .son-aylar { padding: 10px 16px 22px; scroll-padding: 0 16px; gap: 14px; }
  .son-ay { flex-basis: 210px; }
  .son-alt { padding-bottom: 110px; }
  .son-up { margin-left: 0; }
  .mz { padding: 26px 0 34px; }
  .mz-kart-in { padding: 32px 24px 28px; }
  .mz-kart-in::before { inset: 9px; }
  .mz-lead { font-size: 16.5px; }
  .mz-v { min-height: 0; display: grid; gap: 0; }
  .mz-b, .mz-pafta, .mz-not { position: relative; left: auto !important; right: auto !important; top: auto !important; bottom: auto !important; }
  .mz-b--1, .mz-v--mo .mz-b--1 { width: 92%; height: 300px; }
  .mz-v--mo .mz-b--2, .mz-v--mo .mz-b--3 { display: none; }
  .mz-not { width: 92%; margin: -30px 0 0 auto; }
  .mz-k div { padding-right: 16px; margin-right: 16px; }
  .mz-k dd { font-size: 21px; }
  .mz-alt { margin-top: 30px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  [data-rv] { opacity: 1; transform: none; }
}
