/* 03 MODÜLLER — sol kenar menüsü, bento kutular, yumuşak kartlar. */
body.f-moduller { --r: 14px; --r-img: 12px; --side: 232px; }
@media (min-width: 1081px) {
	body.f-moduller .wp-site-blocks { padding-left: var(--side); }
	.f-moduller .spx3-sidebar { position: fixed; inset: 0 auto 0 0; width: var(--side); overflow-y: auto; box-sizing: border-box; padding: 26px 20px; border-right: 1px solid var(--line); background: var(--card); display: flex; flex-direction: column; gap: 20px; }
	.f-moduller .spx-wrap { max-width: 1180px; }
}
.f-moduller .spx3-brand { font-size: 26px; }
.f-moduller .spx3-search .wp-block-search__inside-wrapper { border: 0; background: var(--bg); border-radius: 10px; padding: 2px 4px; }
.f-moduller .spx3-search input { border: 0; background: transparent; font-size: 14px; color: var(--ink); }
.f-moduller .spx3-search button { background: transparent; color: var(--mute); border: 0; }
.f-moduller .spx3-vnav .wp-block-navigation__container { gap: 4px; width: 100%; align-items: stretch; }
.f-moduller .spx3-vnav .wp-block-navigation-item { width: 100%; }
.f-moduller .spx3-vnav .wp-block-navigation-item__content { display: block; width: 100%; box-sizing: border-box; padding: 11px 14px; border-radius: 10px; font: 600 14.5px var(--fb); }
.f-moduller .spx3-vnav .wp-block-navigation-item__content:hover { background: var(--bg); }
.f-moduller .spx3-vnav .current-menu-item > .wp-block-navigation-item__content { background: var(--acc); color: var(--on-acc); }
.f-moduller .spx3-sidetopics { border-top: 1px solid var(--line); padding-top: 18px; }
.f-moduller .spx3-sideh { font: 600 12.5px var(--fb); color: var(--mute); margin-bottom: 10px !important; }
.f-moduller .spx3-vtopics { display: flex; flex-direction: column; gap: 2px; }
.f-moduller .spx3-vtopics a { padding: 8px 10px; border-radius: 8px; font-size: 14px; color: var(--ink); }
.f-moduller .spx3-vtopics a:hover { background: var(--bg); color: var(--acc); }
.f-moduller .spx3-sidenl { display: flex; flex-direction: column; gap: 4px; padding: 14px; border-radius: 12px; background: var(--acc2); font-size: 13px; color: var(--mute); }
.f-moduller .spx3-sidenl b { color: var(--ink); font-size: 14px; }

.f-moduller .spx3-introsec { padding-top: 36px; }
.f-moduller .spx3-intro { display: flex; justify-content: space-between; align-items: flex-end; gap: 32px; }
.f-moduller .spx3-h1 { font: 800 34px/1.1 var(--fd); letter-spacing: -.02em; margin-top: 4px !important; }
.f-moduller .spx3-intro .spx3-tag { max-width: 320px; text-align: right; font-size: 14px; }
.f-moduller .spx3-bentosec { padding-top: 22px; }
.f-moduller .spx3-bento { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); gap: 16px; }
.f-moduller .spx3-bento-big > li, .f-moduller .spx3-bento-small > li { position: relative; overflow: hidden; border-radius: var(--r); display: flex; flex-direction: column; justify-content: flex-end; gap: 14px; padding: 30px; color: #fff; }
.f-moduller .spx3-bento-big > li { min-height: 470px; }
.f-moduller .spx3-bento-small.wp-block-post-template { display: grid; gap: 16px; height: 100%; }
.f-moduller .spx3-bento-small > li { min-height: 227px; }
.f-moduller .spx3-bento li::after { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(0deg, rgba(4, 8, 20, .88), rgba(4, 8, 20, .05) 70%); }
.f-moduller .spx3-bento li > *:not(.spx3-bg) { position: relative; z-index: 2; }
.f-moduller .spx3-bento .spx3-cb { gap: 10px; }
.f-moduller .spx3-bento .spx3-ct { font-size: 24px; color: #fff; }
.f-moduller .spx3-bento-big .spx3-ct { font-size: 36px; letter-spacing: -.02em; }
.f-moduller .spx3-bento .spx3-cex, .f-moduller .spx3-bento .spx3-meta { color: rgba(255, 255, 255, .82); }
.f-moduller .spx3-bento .spx3-kick a { background: var(--acc); color: var(--on-acc); padding: 4px 8px; border-radius: 6px; }
.f-moduller .spx3-bento .spx3-btn { align-self: flex-start; }
.f-moduller .spx3-kick a { background: var(--acc2); color: var(--acc); padding: 4px 8px; border-radius: 6px; font-size: 10.5px; }
.f-moduller .spx3-chipsec { padding-top: 22px; }
.f-moduller .spx3-chiprow { display: flex; gap: 14px; align-items: center; }
.f-moduller .spx3-chipl { font-weight: 600; font-size: 14px; white-space: nowrap; }
.f-moduller .spx3-chips { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
.f-moduller .spx3-chips a { background: var(--acc2); border: 0; color: var(--acc); white-space: nowrap; font-weight: 500; }
.f-moduller .spx3-h2 { font-size: 28px; font-weight: 800; }
.f-moduller .spx3-more { color: var(--acc); }
.f-moduller .spx3-grid.wp-block-post-template > li { background: var(--card); border-radius: var(--r); overflow: hidden; border: 1px solid var(--line); }
.f-moduller .spx3-grid .spx3-img { border-radius: 0; margin: 0; }
.f-moduller .spx3-grid .spx3-cb { padding: 18px 20px 22px; }
.f-moduller .spx3-duo { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 16px; }
.f-moduller .spx3-panel { background: var(--card); border: 1px solid var(--line); border-radius: var(--r); padding: 26px; }
.f-moduller .spx3-panel .spx3-h2 { font-size: 22px; }
.f-moduller .spx3-num.wp-block-post-template > li::before { font: 600 16px/1 var(--fm); color: var(--mute); padding-top: 4px; }
.f-moduller .spx3-num--thumb.wp-block-post-template > li { grid-template-columns: auto 110px 1fr; }
.f-moduller .spx3-num--thumb .spx3-thumb { order: -1; grid-column: 2; grid-row: 1; width: 110px; }
.f-moduller .spx3-num--thumb .spx3-cb { grid-column: 3; }
.f-moduller .spx3-pick { position: relative; overflow: hidden; border-radius: var(--r); background: var(--acc); color: var(--on-acc); padding: 28px; }
.f-moduller .spx3-pick .spx3-label { font-family: var(--fb); font-size: 20px; letter-spacing: 0; text-transform: none; font-weight: 800; }
.f-moduller .spx3-pick .spx3-card-t { font-size: 30px; font-weight: 800; }
.f-moduller .spx3-pick .spx3-card-ex, .f-moduller .spx3-pick .spx3-meta, .f-moduller .spx3-pick .spx3-kick { color: color-mix(in srgb, var(--on-acc) 82%, transparent); }
.f-moduller .spx3-pick .spx3-card-media { aspect-ratio: 2/1; order: 2; }
.f-moduller .spx3-nlband { background: transparent; }
.f-moduller .spx3-nlband .spx-wrap > .spx3-nlband-in { background: var(--acc2); border-radius: var(--r); padding: 30px; }
.f-moduller .spx3-follow-text h2 { font-size: 26px; }
.f-moduller .spx3-nl { border-radius: 10px; }
.f-moduller .spx3-footer { border-top: 0; }
@media (max-width: 1080px) {
	.f-moduller .spx3-sidebar { display: flex; align-items: center; justify-content: space-between; padding: 14px var(--pad); border-bottom: 1px solid var(--line); background: var(--card); }
	.f-moduller .spx3-sidebar > :not(.spx3-brand):not(.spx3-vnav) { display: none; }
	.f-moduller .spx3-bento, .f-moduller .spx3-duo { grid-template-columns: 1fr; }
	.f-moduller .spx3-intro { flex-direction: column; align-items: flex-start; }
	.f-moduller .spx3-intro .spx3-tag { text-align: left; }
}
.f-moduller .spx3-pick .spx3-card-t, .f-moduller .spx3-pick .spx3-card-t a { color: var(--on-acc); }
/* menü ikonları: ilk öğe anasayfa, sonrakiler konu ikonları (sırayla) */
.f-moduller .spx3-vnav .wp-block-navigation-item__content { display: flex; align-items: center; gap: 12px; }
.f-moduller .spx3-vnav .wp-block-navigation-item__content::before { content: ""; width: 20px; height: 20px; flex: none; background: currentColor; -webkit-mask: var(--ic) center / contain no-repeat; mask: var(--ic) center / contain no-repeat; }
.f-moduller .spx3-vnav li:nth-child(6n+1) { --ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linejoin='round'%3E%3Cpath d='M4 11 12 4l8 7v9h-5v-6H9v6H4z'/%3E%3C/svg%3E"); }
.f-moduller .spx3-vnav li:nth-child(6n+2) { --ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8'%3E%3Ccircle cx='12' cy='12' r='8'/%3E%3Cpath d='M9 10c0-2 6-2 6 0s-3 2-3 4m0 3v.01'/%3E%3C/svg%3E"); }
.f-moduller .spx3-vnav li:nth-child(6n+3) { --ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8'%3E%3Crect x='6' y='6' width='12' height='12' rx='2'/%3E%3Cpath d='M9 2v4M15 2v4M9 18v4M15 18v4M2 9h4M2 15h4M18 9h4M18 15h4'/%3E%3C/svg%3E"); }
.f-moduller .spx3-vnav li:nth-child(6n+4) { --ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'%3E%3Cpath d='m8 8-4 4 4 4M16 8l4 4-4 4M14 5l-4 14'/%3E%3C/svg%3E"); }
.f-moduller .spx3-vnav li:nth-child(6n+5) { --ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linejoin='round'%3E%3Cpath d='M9 3h6M10 3v6l-5 9a2 2 0 0 0 2 3h10a2 2 0 0 0 2-3l-5-9V3'/%3E%3C/svg%3E"); }
.f-moduller .spx3-vnav li:nth-child(6n) { --ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 8v4l3 2'/%3E%3C/svg%3E"); }
