/* =====================================================================
   Cream — küçük sürprizler (2026-10-27)
   delight.js ile birlikte çalışır. Kaldırmak için index.html'deki
   delight.css / delight.js satırlarını silmek yeterli.
   ===================================================================== */

/* ---------- 1. Çapraz şef bıçakları (Şefin önerisi + Mutfak & Bar) ---------- */
.dl-knives { position: relative; display: inline-block; flex: 0 0 auto; width: 40px; height: 34px; vertical-align: middle; cursor: pointer; }
.dl-knives svg { position: absolute; left: 50%; top: 50%; width: 44px; height: 10px; margin: -5px 0 0 -22px; overflow: visible; transition: transform .7s cubic-bezier(.3, 1.6, .5, 1); filter: drop-shadow(0 2px 2px rgba(0, 0, 0, .28)); }
.dl-knives .k1 { transform: rotate(135deg); }
.dl-knives .k2 { transform: rotate(45deg) scaleY(-1); }
.dl-knives:hover .k1, .dl-knives.clash .k1 { transform: rotate(150deg) translateX(3px); }
.dl-knives:hover .k2, .dl-knives.clash .k2 { transform: rotate(30deg) scaleY(-1) translateX(3px); }
.dl-knives .glint { transform: translateX(-24px); animation: dlGlint 5.5s ease-in-out infinite; }
.dl-knives .k2 .glint { animation-delay: .25s; }
.dl-knives:hover .glint, .dl-knives.clash .glint { animation: dlGlint .7s ease-out 1; }
@keyframes dlGlint { 0%, 70% { transform: translateX(-24px); } 100% { transform: translateX(40px); } }
.dl-spark { position: absolute; left: 50%; top: 46%; width: 4px; height: 4px; margin: -2px; border-radius: 50%; background: #FFF4D6; box-shadow: 0 0 8px 2px #F6D59A; opacity: 0; pointer-events: none; }
.dl-knives:hover .dl-spark, .dl-knives.clash .dl-spark { animation: dlSpark .55s ease-out .18s 1; }
@keyframes dlSpark { 0% { opacity: 0; transform: scale(.2); } 30% { opacity: 1; transform: scale(1.6); } 100% { opacity: 0; transform: scale(.4) translateY(-6px); } }
.eyebrow .dl-knives { margin: -8px 0 -8px 2px; }
.chef-eyebrow .dl-knives { margin: -8px -2px -8px 0; }

/* Harita etiketindeki çapraz şef bıçakları */
.map-tag .dl-tagknife { width: 30px; height: 26px; margin: -6px 0; cursor: default; }
.map-tag .dl-tagknife svg { width: 33px; height: 7.5px; margin: -3.75px 0 0 -16.5px; filter: drop-shadow(0 1px 1px rgba(0, 0, 0, .5)); }
.map-tag .dl-tagknife rect[rx="3.3"] { fill: #C29466; }
.map-tag .dl-tagknife circle { fill: #6B4630; }
.map-tag:hover .dl-tagknife .k1 { transform: rotate(150deg) translateX(2px); }
.map-tag:hover .dl-tagknife .k2 { transform: rotate(30deg) scaleY(-1) translateX(2px); }
@media (max-width: 899px) {
    .map-tag .dl-tagknife { width: 22px; height: 20px; margin: -5px 0; }
    .map-tag .dl-tagknife svg { width: 25px; height: 5.7px; margin: -2.85px 0 0 -12.5px; }
}

/* ---------- 2. Mutfak kartlarında çatal imleci ---------- */
.dish a { cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Cg transform='rotate(-35 16 16)' fill='%234B2B25' stroke='%23F6F0E7' stroke-width='1.2' stroke-linejoin='round'%3E%3Cpath d='M11 2v8c0 2.2 1.6 3.6 3.6 4L14 29.4c0 1 .9 1.6 2 1.6s2-.6 2-1.6L17.4 14c2-.4 3.6-1.8 3.6-4V2h-1.4v7.4h-1.3V2h-1.4v7.4h-1.3V2h-1.4v7.4h-1.3V2z'/%3E%3C/g%3E%3C/svg%3E") 7 4, pointer; }

/* ---------- 3. Felsefe: kendi kendine çizilen latte kalbi ---------- */
.dl-latte { display: block; width: 88px; height: 88px; margin: 0 auto 18px; overflow: visible; }
.dl-latte .heart { stroke-dasharray: 120; stroke-dashoffset: 120; transition: stroke-dashoffset 2.2s cubic-bezier(.6, .1, .3, 1) .4s; }
.dl-latte .crema { transform-origin: 37px 37px; transform: scale(.2); opacity: 0; transition: transform 1.2s var(--ease, ease), opacity .8s; }
.dl-latte.in .heart { stroke-dashoffset: 0; }
.dl-latte.in .crema { transform: none; opacity: 1; }
.dl-latte .steam { stroke-dasharray: 26 60; stroke-dashoffset: 26; opacity: 0; animation: dlSteam 3.6s ease-in-out infinite; }
.dl-latte .steam:nth-of-type(2) { animation-delay: 1.2s; }
.dl-latte .steam:nth-of-type(3) { animation-delay: 2.4s; }
@keyframes dlSteam { 0% { stroke-dashoffset: 26; opacity: 0; } 30% { opacity: .55; } 100% { stroke-dashoffset: -60; opacity: 0; } }
.dl-latte:hover { animation: dlStir 1s ease-in-out 1; }
@keyframes dlStir { 30% { transform: rotate(-12deg); } 65% { transform: rotate(9deg); } }

/* ---------- 4. Hero gökyüzünde ara sıra süzülen martı ---------- */
.dl-gull { position: absolute; z-index: 1; top: 14%; left: 0; width: 46px; height: 19px; pointer-events: none; opacity: 0; }
.dl-gull svg { width: 100%; height: 100%; overflow: visible; }
.dl-gull .wings { transform-origin: 17px 7px; animation: dlFlap .5s ease-in-out infinite alternate; }
@keyframes dlFlap { from { transform: scaleY(1); } to { transform: scaleY(.35); } }
.dl-gull.fly { animation: dlFly 16s linear 1 forwards; }
@keyframes dlFly {
    0% { opacity: 0; transform: translate(105vw, 30px) scale(.8); }
    6% { opacity: .75; }
    50% { transform: translate(50vw, -18px) scale(1); }
    94% { opacity: .75; }
    100% { opacity: 0; transform: translate(-10vw, 22px) scale(.85); }
}

/* ---------- 5. Kutlama kartlarında konfeti ---------- */
.dl-confetti { position: absolute; z-index: 3; left: 50%; top: 22%; width: 7px; height: 11px; border-radius: 2px; pointer-events: none; }

/* ---------- 6. Gizli kahve çekirdeği yağmuru ---------- */
.dl-bean { position: fixed; z-index: 2000; top: -40px; width: 22px; height: 28px; pointer-events: none; }
.dl-toast { position: fixed; z-index: 2001; left: 50%; bottom: calc(96px + var(--bar-h, 0px)); translate: -50% 0; padding: 12px 20px; border-radius: 999px; background: var(--espresso, #2B1A16); color: var(--cream, #F6F0E7); font-weight: 700; font-size: .88rem; box-shadow: 0 0 0 1px rgba(201, 162, 115, .5), 0 20px 40px -18px rgba(0, 0, 0, .6); opacity: 0; transform: translateY(14px); transition: opacity .4s, transform .5s cubic-bezier(.2, 1.4, .4, 1); pointer-events: none; white-space: nowrap; }
.dl-toast.on { opacity: 1; transform: none; }
.dl-toast em { font-family: var(--display); font-weight: 400; color: #E2C49B; }

@media (prefers-reduced-motion: reduce) {
    .dl-knives .glint, .dl-latte .steam, .dl-gull, .dl-gull .wings { animation: none !important; }
    .dl-gull { display: none; }
    .dl-latte .heart { stroke-dashoffset: 0; transition: none; }
    .dl-latte .crema { transform: none; opacity: 1; transition: none; }
}

/* =====================================================================
   İkinci sürpriz paketi: kafe ikonları + hero gün batımı silüeti
   ===================================================================== */
.ic { width: 32px; height: 32px; overflow: visible; }
.ic .ic-fill { fill: currentColor; stroke: none; }
.ic .ic-dots { stroke-width: 2.4; }
.ic-steam path { stroke-dasharray: 8 14; stroke-dashoffset: 8; opacity: 0; animation: icSteam 2.8s ease-in-out infinite; }
.ic-steam path:nth-child(2) { animation-delay: .9s; } .ic-steam path:nth-child(3) { animation-delay: 1.8s; }
@keyframes icSteam { 0% { stroke-dashoffset: 8; opacity: 0; } 35% { opacity: .9; } 100% { stroke-dashoffset: -14; opacity: 0; } }
.ic-drop { animation: icDrop 2.6s ease-in infinite; }
@keyframes icDrop { 0%, 55% { transform: translateY(0); opacity: 1; } 100% { transform: translateY(7px); opacity: 0; } }

/* Menü bölümleri: ikon kayarak gelir */
.dl-mi { position: relative; }
.dl-mi > span { transition: transform .45s var(--ease); }
.dl-mi-ic { position: absolute; left: 14px; top: 50%; width: 20px; height: 20px; margin-top: -10px; color: var(--gold, #C9A273); opacity: 0; transform: translateX(-8px) rotate(-12deg) scale(.7); transition: opacity .35s, transform .5s cubic-bezier(.3, 1.6, .5, 1); pointer-events: none; }
.dl-mi:hover .dl-mi-ic, .dl-mi.on .dl-mi-ic, .dl-mi:focus-visible .dl-mi-ic { opacity: 1; transform: none; }
/* İkon çizgiden 12px içeride, yazı ikondan 12px sonra başlar; numara sağda sabit kalır */
.chapters .dl-mi:hover, .chapters .dl-mi.on, .chapters .dl-mi:focus-visible { padding-left: 46px; }
.chapters .dl-mi.on { box-shadow: inset 2px 0 var(--latte, #C8A27C); background: linear-gradient(90deg, color-mix(in srgb, var(--latte, #C8A27C) 14%, transparent), transparent 75%); }
.chapters .dl-mi.on .dl-mi-ic { color: var(--latte, #C8A27C); }
.chapters .dl-mi .pg { padding-right: 8px; }

/* Günün ritmi kartları */
.dl-mom-ic { position: absolute; right: 14px; top: 14px; width: 30px; height: 30px; color: color-mix(in srgb, var(--latte-ink) 55%, transparent); transition: color .5s, transform .6s cubic-bezier(.3, 1.6, .5, 1); }
.moment:hover .dl-mom-ic, .moment.now .dl-mom-ic, .moment.next .dl-mom-ic { color: var(--gold, #C9A273); transform: translateY(-3px) rotate(-6deg) scale(1.12); }
.moment:not(:hover):not(.now):not(.next) .dl-mom-ic .ic-steam path { animation-play-state: paused; opacity: 0; }

/* Süzülen çizimler */
.dl-floaters { position: absolute; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; }
.manifesto > .wrap, #yorumlar > .section-fit-content, #yorumlar > .wrap { position: relative; z-index: 1; }
.dl-fl { position: absolute; color: color-mix(in srgb, var(--gold, #C9A273) 70%, var(--coffee)); opacity: .32; transform: rotate(var(--r)) scale(var(--s)); animation: dlFloat 9s ease-in-out infinite; animation-delay: var(--d); }
.dl-fl .ic { width: 46px; height: 46px; }
@keyframes dlFloat { 0%, 100% { translate: 0 0; } 50% { translate: 0 -12px; } }
@media (max-width: 899px) { .dl-fl--desk { display: none; } .dl-fl { opacity: .22; } .dl-fl .ic { width: 34px; height: 34px; } }

@media (prefers-reduced-motion: reduce) {
    .ic-steam path, .ic-drop, .dl-fl { animation: none !important; }
}