.ak-dergilerim-section {
width: 100%;
margin: 1.5rem 0;
box-sizing: border-box;
font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
} .ak-dergilerim-header {
display: flex;
align-items: baseline;
justify-content: space-between;
border-bottom: 1px solid #e7e5e4;
padding-bottom: 0.625rem;
margin-bottom: 0.75rem;
}
.dark .ak-dergilerim-header,
html.dark .ak-dergilerim-header {
border-bottom-color: rgba(41, 37, 36, 0.8);
}
.ak-dergilerim-title {
font-family: 'JetBrains Mono', Menlo, Monaco, Consolas, monospace;
font-size: 0.75rem; text-transform: uppercase;
letter-spacing: 0.1em;
font-weight: 600;
color: #292524;
margin: 0;
}
.dark .ak-dergilerim-title,
html.dark .ak-dergilerim-title {
color: #e7e5e4;
}
.ak-dergi-nav-btn {
width: 1.5rem;
height: 1.5rem;
border-radius: 0.25rem;
border: 1px solid #d6d3d1;
background: transparent;
display: inline-flex;
align-items: center;
justify-content: center;
color: #78716c;
font-family: 'JetBrains Mono', monospace;
font-size: 0.75rem;
cursor: pointer;
transition: all 0.15s ease;
user-select: none;
-webkit-tap-highlight-color: transparent;
padding: 0;
}
.ak-dergi-nav-btn:hover {
color: #1c1917;
border-color: #a8a29e;
}
.ak-dergi-nav-btn:active {
transform: scale(0.95);
}
.dark .ak-dergi-nav-btn,
html.dark .ak-dergi-nav-btn {
border-color: #292524;
color: #a8a29e;
}
.dark .ak-dergi-nav-btn:hover,
html.dark .ak-dergi-nav-btn:hover {
color: #f5f5f4;
border-color: #57534e;
} .ak-dergilerim-strip {
display: flex;
gap: 1rem;
overflow-x: auto;
scroll-behavior: smooth;
padding: 0.75rem 0.25rem;
align-items: flex-start;
user-select: none;
-webkit-user-select: none;
scroll-snap-type: x mandatory;
-webkit-overflow-scrolling: touch;
scrollbar-width: none; -ms-overflow-style: none; }
@media (min-width: 640px) {
.ak-dergilerim-strip {
gap: 1.5rem;
}
}
.ak-dergilerim-strip::-webkit-scrollbar {
display: none; } .ak-dergilerim-strip.drag-scroll-strip {
cursor: grab;
}
.ak-dergilerim-strip.drag-scroll-strip:active,
.ak-dergilerim-strip.is-dragging {
cursor: grabbing !important;
} .ak-dergi-card {
position: relative;
flex-shrink: 0;
perspective: 1000px;
cursor: pointer;
user-select: none;
box-sizing: border-box;
scroll-snap-align: start;
text-decoration: none !important;
color: inherit !important;
display: flex;
flex-direction: column;
transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
outline: none;
} .ak-dergi-cover-wrap {
position: relative;
width: 100%;
display: flex;
align-items: flex-end;
justify-content: center;
transition: transform 0.3s ease;
}
.ak-dergi-img {
width: auto;
max-width: 100%;
object-fit: contain;
display: block;
border-radius: 2px 5px 5px 2px;
box-shadow: 
-3px 0 6px -2px rgba(0, 0, 0, 0.25),
5px 8px 18px -2px rgba(0, 0, 0, 0.22),
0 2px 4px rgba(0, 0, 0, 0.1);
transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.3s ease;
transform-origin: left center;
} .ak-dergi-card:hover .ak-dergi-img {
transform: translateY(-5px) rotateY(-3deg);
box-shadow: 
-5px 0 10px -2px rgba(0, 0, 0, 0.32),
12px 18px 28px -3px rgba(0, 0, 0, 0.28),
0 4px 10px rgba(0, 0, 0, 0.15);
} .ak-dergi-cover-fallback {
position: relative;
border-radius: 2px 7px 7px 2px;
box-shadow: 
-4px 0 6px -2px rgba(0,0,0,0.3),
6px 10px 20px -3px rgba(0, 0, 0, 0.22),
0 2px 6px rgba(0,0,0,0.12);
transition: transform 0.3s ease, box-shadow 0.3s ease;
transform-origin: left center;
overflow: hidden;
display: flex;
flex-direction: column;
justify-content: space-between;
padding: 14px 12px;
box-sizing: border-box;
} .ak-dergi-cover-fallback::before {
content: '';
position: absolute;
top: 0;
left: 0;
bottom: 0;
width: 8px;
background: linear-gradient(90deg, rgba(0,0,0,0.25) 0%, rgba(255,255,255,0.15) 50%, rgba(0,0,0,0.18) 100%);
pointer-events: none;
z-index: 10;
} .ak-dergi-cover-fallback::after {
content: '';
position: absolute;
top: 3px;
right: 2px;
bottom: 3px;
width: 2px;
background: repeating-linear-gradient(180deg, #f5f5f4 0px, #e7e5e4 2px);
box-shadow: 1px 0 2px rgba(0,0,0,0.2);
pointer-events: none;
}
.ak-dergi-card:hover .ak-dergi-cover-fallback {
transform: translateY(-8px) rotateY(-8deg);
box-shadow: 
-6px 0 10px -2px rgba(0,0,0,0.35),
14px 22px 32px -4px rgba(0, 0, 0, 0.32),
0 4px 10px rgba(0,0,0,0.15);
} .ak-dergi-meta {
width: 100%;
max-width: 100%;
box-sizing: border-box;
padding-top: 0.625rem;
text-align: left;
}
.ak-dergi-meta h3 {
font-family: 'Newsreader', Georgia, 'Times New Roman', serif;
font-size: 13px;
line-height: 1.35;
font-weight: 500;
color: #1c1917;
overflow-wrap: break-word;
word-break: break-word;
hyphens: auto;
margin: 0;
transition: color 0.15s ease;
}
.dark .ak-dergi-meta h3,
html.dark .ak-dergi-meta h3 {
color: #f5f5f4;
}
.ak-dergi-card:hover .ak-dergi-meta h3 {
color: #b45309; }
.dark .ak-dergi-card:hover .ak-dergi-meta h3,
html.dark .ak-dergi-card:hover .ak-dergi-meta h3 {
color: #fbbf24; }
.ak-dergi-meta p {
font-family: 'JetBrains Mono', Menlo, Monaco, Consolas, monospace;
font-size: 10px;
color: #b45309;
overflow-wrap: break-word;
word-break: break-word;
line-height: 1.25;
padding-top: 2px;
margin: 0;
}
.dark .ak-dergi-meta p,
html.dark .ak-dergi-meta p {
color: #fbbf24;
}
.ak-dergi-meta div {
font-family: 'JetBrains Mono', Menlo, Monaco, Consolas, monospace;
font-size: 10px;
color: #a8a29e;
padding-top: 4px;
}
.dark .ak-dergi-meta div,
html.dark .ak-dergi-meta div {
color: #78716c;
} .ak-dergi-divider {
width: 1px;
height: 200px;
flex-shrink: 0;
align-self: flex-start;
margin: 4px 6px 0 6px;
background: linear-gradient(180deg, transparent 0%, rgba(214, 211, 209, 0.7) 50%, transparent 100%);
pointer-events: none;
}
.dark .ak-dergi-divider,
html.dark .ak-dergi-divider {
background: linear-gradient(180deg, transparent 0%, rgba(68, 64, 60, 0.7) 50%, transparent 100%);
}
@media (min-width: 640px) {
.ak-dergi-divider {
margin-left: 8px;
margin-right: 8px;
}
}