/* SHHURABABY ortak stiller (tüm sayfalar) */

/* ---- 3D dönen logo ---- */
.logo-spin { display: inline-block; position: relative; perspective: 520px; vertical-align: middle; line-height: 0; }
.logo-spin .ls-in { position: relative; display: block; transform-style: preserve-3d; animation: sb-logo-spin 16s linear infinite; }
.logo-spin .ls-in > img { display: block; position: relative; }
.logo-spin .ls-layer { position: absolute !important; left: 0; top: 0; width: 100%; height: 100%; pointer-events: none; opacity: .55; filter: invert(1) brightness(.62) !important; transform: translateZ(var(--z)); transition: none !important; }
@keyframes sb-logo-spin { from { transform: rotateY(0deg); } to { transform: rotateY(360deg); } }
html.intro-logo-hold .logo-spin { opacity: 0; }
html.intro-logo-hold .logo-spin .ls-in { animation: none; }
.logo-spin:hover .ls-in { animation-duration: 5s; }
@media (prefers-reduced-motion: reduce) { .logo-spin .ls-in { animation: none; } }

/* ---- sayfa geçişi: perde + menü ---- */
html.page-enter::before { content: ""; position: fixed; inset: 0; background: #000; z-index: 100001; }
html.page-enter { overflow: hidden; }
header { transition: transform 1.1s cubic-bezier(.76, 0, .24, 1); }
html.page-enter header { transform: translateY(-100%); }
html.page-enter header .nav-left a, html.page-enter header .nav-right > a, html.page-enter header .lang-switch { opacity: 0 !important; transform: translateY(-14px); filter: blur(6px); }
header .nav-left a, header .nav-right > a, header .lang-switch { transition: opacity .8s ease, transform .9s cubic-bezier(.16, 1, .3, 1), filter .8s ease; }
header .nav-left a:nth-child(1) { transition-delay: .55s; } header .nav-left a:nth-child(2) { transition-delay: .65s; }
header .nav-right > a { transition-delay: .75s; } header .lang-switch { transition-delay: .85s; }

.pg-curtain { position: fixed; inset: 0; z-index: 100000; pointer-events: none; }
.pg-curtain.block { pointer-events: auto; }
.pg-curtain i { position: absolute; left: 0; width: 100%; height: 50.5%; background: #000; transition: transform 1s cubic-bezier(.76, 0, .24, 1); }
.pg-curtain i:nth-child(1) { top: 0; } .pg-curtain i:nth-child(2) { bottom: 0; }
.pg-curtain.open i:nth-child(1) { transform: translateY(-101%); }
.pg-curtain.open i:nth-child(2) { transform: translateY(101%); }
.pg-curtain b { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); font: 500 .68rem/1 "SF Mono", ui-monospace, Menlo, monospace; letter-spacing: .3em; text-transform: uppercase; color: rgba(255,255,255,.7); transition: opacity .4s ease; z-index: 2; }
.pg-curtain.open b { opacity: 0; }

/* ---- ortak galeri dili: bölüm etiketleri, çerçeveli eserler ---- */
.sb-plate { display: block; margin-top: .9rem; font: 500 .62rem/1.3 "SF Mono", ui-monospace, Menlo, monospace; letter-spacing: .16em; text-transform: uppercase; opacity: .55; }
.sb-word { display: inline-block; opacity: .16; transition: opacity .6s ease; }
.sb-word.on { opacity: 1; }

/* ---------- telefon: derli toplu başlık çubuğu (tüm sayfalar) ---------- */
@media (max-width: 768px) {
    html:root { --nav-height: 84px; }
    html header { flex-direction: row; flex-wrap: wrap; align-items: center; justify-content: center; gap: .15rem .9rem; padding: .6rem 1rem .5rem; height: var(--nav-height); }
    html header .nav-center { order: -1; flex: 0 0 100%; display: flex; justify-content: center; margin: 0; }
    html header .nav-center .logo { height: 34px; width: auto; }
    html header .nav-left, html header .nav-right { flex: 0 0 auto; width: auto; gap: .9rem; justify-content: center; }
    html header a { font-size: .64rem; letter-spacing: .08em; }
    html header .lang-switch { margin: 0; padding-left: .9rem; }
    html header .lang-btn { font-size: .64rem; }
}

/* telefon: arşiv yazıları ekrana sığsın */
@media (max-width: 768px) {
    .arc-sub { padding: 0 1.2rem; }
    .arc-sub p { font-size: .7rem; letter-spacing: .18em; line-height: 1.7; }
    .arc-sub small { letter-spacing: .14em; }
    .arc-status { letter-spacing: .2em; font-size: .66rem; }
    .site-footer { padding: 2rem 1.2rem; letter-spacing: .12em; line-height: 1.7; }
}

@media (max-width: 768px) {
    html .glass-toggle-btn { top: auto; bottom: 1rem; left: auto; right: 1rem; transform: none; width: 46px; height: 46px; }
    html .glass-toggle-btn svg { width: 24px; height: 24px; }
}
