@font-face { font-family: 'Platypi'; src: url('../yazi/platypi.woff2') format('woff2'); font-weight: 300 800; font-display: swap; }
@font-face { font-family: 'Ysabeau Office'; src: url('../yazi/ysabeau-office.woff2') format('woff2'); font-weight: 1 1000; font-display: swap; }
:root { --beyaz: #ffffff; --nane: #5faf93; --nane-koyu: #2f7d66; --nane-acik: #ddf1e9; --murekkep: #1e3b34;
        --serit-zemin: #ffffff; --serit-yazi: #2f7d66; --serit-cizgi: rgba(47,125,102,.18); --vurgu: #5faf93;
        --yt-zemin: #ddf1e9; --yt-yazi: #2f7d66; --yt-yazi-tipi: 'Platypi', serif; }
body { background: var(--beyaz); color: var(--murekkep); font: 400 18px/1.7 'Ysabeau Office', 'Segoe UI', sans-serif; }
.giris { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: 5vw; padding: 7vw 5vw 0 7vw; }
.sol { padding-top: 2vw; }
.logoYazi { font: 400 clamp(76px, 9vw, 164px)/.9 'Platypi', serif; letter-spacing: -.02em; color: var(--nane-koyu); }
.logoYazi small { display: block; margin: 26px 0 0 .3em; font: 500 16px/1 'Ysabeau Office', sans-serif; letter-spacing: .42em; color: var(--nane); }
.logoResim { max-width: 280px; }
.konsept { margin-top: 44px; max-width: 20em; font: 300 clamp(22px, 1.8vw, 29px)/1.4 'Platypi', serif; }
.saat { margin-top: 44px; max-width: 26em; }
.saat p { display: flex; justify-content: space-between; gap: 16px; padding: 10px 0; border-bottom: 1px solid var(--nane-acik); font-variant-numeric: tabular-nums; }
.saat p span:first-child { color: var(--nane-koyu); }
.saat .simdiki { font-weight: 700; }
.durum { margin-top: 12px; font-size: 15px; color: var(--nane-koyu); }
.giris .vitrin { aspect-ratio: 4 / 5; margin-top: 10vh; }
.tezgah { padding: 9vw 7vw 7vw; }
.tezgah h2 { font: 300 clamp(30px, 2.6vw, 44px)/1 'Platypi', serif; color: var(--nane-koyu); margin-bottom: 36px; }
.cesitler { list-style: none; padding: 0; columns: 2; column-gap: 7vw; max-width: 1240px; }
.cesitler li { break-inside: avoid; display: grid; grid-template-columns: 34px 1fr; column-gap: 16px; padding: 18px 0 20px; border-top: 1px solid var(--nane-acik); }
.cesitler .top { width: 26px; height: 26px; margin-top: 10px; border-radius: 50%; background: var(--r); box-shadow: inset 0 -3px 0 rgba(0,0,0,.08), 0 0 0 1px rgba(30,59,52,.12); }
.cesitler .kalem { font: 400 clamp(26px, 2.3vw, 38px)/1.15 'Platypi', serif; }
.cesitler .aciklama { grid-column: 2; font-size: 16px; opacity: .78; }
.galeri { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 3vw; padding: 0 7vw 8vw; align-items: start; }
.galeri .ornekGorsel { aspect-ratio: 5 / 8; }
.galeri .ornekGorsel:nth-child(2) { margin-top: 12vw; }
.galeri .ornekGorsel:nth-child(3) { margin-top: 5vw; }
.son { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 5vw; align-items: end; padding: 6vw 7vw; background: var(--nane-acik); }
.son h2 { font: 600 13px/1 'Ysabeau Office', sans-serif; letter-spacing: .34em; color: var(--nane-koyu); margin-bottom: 12px; }
.son .ig { font: 400 clamp(28px, 2.5vw, 42px)/1.1 'Platypi', serif; color: var(--nane-koyu); }
.son .igNot { margin-top: 6px; font-size: 15px; opacity: .75; }
.son .miniPlan { color: var(--nane-koyu); }
.son .yerYazi { margin-top: 10px; }
@media (max-width: 860px) {
  .giris { grid-template-columns: 1fr; padding: 40px 20px 0; gap: 34px; }
  .konsept, .saat { margin-top: 28px; }
  .giris .vitrin { margin-top: 0; aspect-ratio: 4 / 5; }
  .tezgah { padding: 64px 20px 44px; }
  .cesitler { columns: 1; }
  .galeri { grid-template-columns: 1fr 1fr; padding: 0 16px 56px; gap: 10px; }
  .galeri .ornekGorsel:nth-child(2) { margin-top: 18vw; }
  .galeri .ornekGorsel:nth-child(3) { grid-column: 1 / 3; margin-top: 0; aspect-ratio: 4 / 3; }
  .son { grid-template-columns: 1fr; padding: 44px 20px; }
}
.sol .logoResim { width: min(560px, 100%); max-width: none; height: auto; }
