/** * Blog archive listing (scoped to .atabay-shell--blog-archive). * Tam koyu kabuk (atabay-blog-arsiv.html); hero/footer bantları atabay.css page-bands ile. */ /* WP blog index: — padding reset + koyu zemin (shell--light krem uygulamasın) */ body.body-atabay.blog { padding: 0 !important; background-color: var(--ink, #15130f) !important; } body.body-atabay .atabay-shell--light.atabay-shell--blog-archive { background: var(--ink, #15130f) !important; color: var(--white, #f5f4ef) !important; } /* ─── SITE WIDTH (page-bands; --atabay-site-gutter WP'de 0 olabilir) ─── */ body.body-atabay .atabay-shell--page-bands.atabay-shell--blog-archive .blog-archive { padding: clamp(48px, 6vw, 80px) clamp(20px, 2.2vw, 64px); width: min(100%, var(--atabay-site-max-width, 1280px)); margin-left: auto; margin-right: auto; box-sizing: border-box; } /* ─── BLOG ARCHIVE LAYOUT ─── */ body.body-atabay .atabay-shell--blog-archive .blog-archive { box-sizing: border-box; } body.body-atabay .atabay-shell--blog-archive .ba-toolbar { display: flex; justify-content: space-between; align-items: center; margin-bottom: 64px; gap: 24px; flex-wrap: wrap; } body.body-atabay .atabay-shell--blog-archive .ba-count { font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--g400, #6a6a68); font-family: "Syne", sans-serif; font-weight: 600; } body.body-atabay .atabay-shell--blog-archive .ba-empty { margin: 0 0 8px; padding: 48px 24px; border: 1px dashed var(--line, rgba(245, 244, 239, 0.1)); text-align: center; } body.body-atabay .atabay-shell--blog-archive .ba-empty-msg { margin: 0 auto; font-size: 15px; line-height: 1.65; color: var(--g300, #929290); max-width: 36rem; } /* ─── CATEGORY FILTER ─── */ body.body-atabay .atabay-shell--blog-archive .ba-cats { display: flex; gap: 8px; flex-wrap: wrap; } body.body-atabay .atabay-shell--blog-archive a.ba-cat-btn { font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase; font-family: "Syne", sans-serif; font-weight: 600; padding: 9px 20px; border: 1px solid var(--line, rgba(245, 244, 239, 0.1)); color: var(--g300, #929290); background: transparent; cursor: none; transition: all 0.3s; text-decoration: none; } @media (max-width: 1100px) { body.body-atabay .atabay-shell--blog-archive a.ba-cat-btn { cursor: auto; } } body.body-atabay .atabay-shell--blog-archive a.ba-cat-btn:hover, body.body-atabay .atabay-shell--blog-archive a.ba-cat-btn.active { border-color: var(--white, #f5f4ef); color: var(--white, #f5f4ef); background: rgba(245, 244, 239, 0.06); } body.body-atabay .atabay-shell--blog-archive a.ba-cat-btn.active { background: var(--white, #f5f4ef); color: var(--ink, #15130f); border-color: var(--white, #f5f4ef); } /* ─── FEATURED POST ─── */ body.body-atabay .atabay-shell--blog-archive a.ba-featured { display: grid; grid-template-columns: 1.4fr 1fr; align-items: stretch; background: var(--g800, #26241f); border: 1px solid var(--line, rgba(245, 244, 239, 0.1)); margin-bottom: 3px; overflow: hidden; position: relative; color: inherit; text-decoration: none; } body.body-atabay .atabay-shell--blog-archive .ba-feat-img { overflow: hidden; position: relative; background: var(--ink, #15130f); min-height: 100%; align-self: stretch; display: flex; align-items: center; justify-content: center; } body.body-atabay .atabay-shell--blog-archive .ba-feat-img img { width: 100%; height: 100%; display: block; object-fit: cover; object-position: center center; transition: transform 0.9s cubic-bezier(0.77, 0, 0.18, 1); } body.body-atabay .atabay-shell--blog-archive .ba-feat-img-placeholder { width: 100%; height: 100%; min-height: 480px; background: linear-gradient(135deg, var(--g800, #26241f) 0%, var(--g600, #454240) 60%, var(--g800, #26241f) 100%); display: flex; align-items: center; justify-content: center; } body.body-atabay .atabay-shell--blog-archive .ba-feat-img-text { font-family: "Cormorant Garamond", serif; font-size: 100px; font-weight: 300; color: rgba(245, 244, 239, 0.06); user-select: none; } body.body-atabay .atabay-shell--blog-archive a.ba-featured:hover .ba-feat-img img { transform: scale(1.04); } body.body-atabay .atabay-shell--blog-archive .ba-feat-content { padding: 52px 48px; display: flex; flex-direction: column; justify-content: space-between; } body.body-atabay .atabay-shell--blog-archive .ba-feat-meta { display: flex; align-items: center; gap: 16px; margin-bottom: 28px; flex-wrap: wrap; } body.body-atabay .atabay-shell--blog-archive .ba-feat-cat { font-size: 9px; letter-spacing: 0.18em; text-transform: uppercase; font-family: "Syne", sans-serif; font-weight: 700; color: var(--white, #f5f4ef); border: 1px solid var(--line, rgba(245, 244, 239, 0.1)); padding: 5px 14px; } body.body-atabay .atabay-shell--blog-archive .ba-feat-date { font-size: 10px; letter-spacing: 0.1em; color: var(--g400, #6a6a68); font-family: "Syne", sans-serif; } body.body-atabay .atabay-shell--blog-archive .ba-feat-title { font-family: "Cormorant Garamond", serif; font-size: clamp(28px, 3.5vw, 44px); font-weight: 400; line-height: 1.1; color: var(--white, #f5f4ef); margin: 0 0 24px; transition: color 0.3s; } body.body-atabay .atabay-shell--blog-archive a.ba-featured:hover .ba-feat-title { color: var(--g100, #d8d7cf); } body.body-atabay .atabay-shell--blog-archive .ba-feat-excerpt { font-size: 14px; line-height: 1.75; color: var(--g300, #929290); margin-bottom: 28px; max-width: 400px; } body.body-atabay .atabay-shell--blog-archive .ba-feat-footer { display: flex; align-items: center; justify-content: space-between; border-top: 1px solid var(--line, rgba(245, 244, 239, 0.1)); padding-top: 28px; } body.body-atabay .atabay-shell--blog-archive .ba-feat-author { display: flex; align-items: center; gap: 12px; } body.body-atabay .atabay-shell--blog-archive .ba-feat-avatar { width: 36px; height: 36px; border-radius: 50%; background: var(--g600, #454240); display: flex; align-items: center; justify-content: center; font-size: 11px; font-weight: 700; font-family: "Syne", sans-serif; color: var(--white, #f5f4ef); flex-shrink: 0; } body.body-atabay .atabay-shell--blog-archive .ba-feat-author-name { font-size: 12px; font-family: "Syne", sans-serif; font-weight: 600; color: var(--white, #f5f4ef); } body.body-atabay .atabay-shell--blog-archive .ba-feat-read { font-size: 10px; color: var(--g400, #6a6a68); } body.body-atabay .atabay-shell--blog-archive .ba-feat-arrow { font-size: 22px; color: var(--g400, #6a6a68); transition: transform 0.35s, color 0.3s; line-height: 1; } body.body-atabay .atabay-shell--blog-archive a.ba-featured:hover .ba-feat-arrow { transform: translate(4px, -4px); color: var(--white, #f5f4ef); } /* ─── POST GRID ─── */ body.body-atabay .atabay-shell--blog-archive .ba-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 3px; margin-bottom: 3px; } body.body-atabay .atabay-shell--blog-archive a.ba-card { background: var(--g800, #26241f); overflow: hidden; position: relative; cursor: none; display: flex; flex-direction: column; color: inherit; text-decoration: none; } @media (max-width: 1100px) { body.body-atabay .atabay-shell--blog-archive a.ba-card { cursor: auto; } } body.body-atabay .atabay-shell--blog-archive a.ba-card::before { content: ""; position: absolute; inset: 0; background: var(--ink, #15130f); transform: scaleY(0); transform-origin: bottom; transition: transform 0.4s cubic-bezier(0.77, 0, 0.18, 1); z-index: 0; } body.body-atabay .atabay-shell--blog-archive a.ba-card:hover::before { transform: scaleY(1); } body.body-atabay .atabay-shell--blog-archive a.ba-card * { position: relative; z-index: 1; } body.body-atabay .atabay-shell--blog-archive .ba-card-img { width: 100%; height: 280px; overflow: hidden; position: relative; background: var(--g800, #26241f); } body.body-atabay .atabay-shell--blog-archive .ba-card-img img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.8s cubic-bezier(0.77, 0, 0.18, 1); } body.body-atabay .atabay-shell--blog-archive a.ba-card:hover .ba-card-img img { transform: scale(1.06); } body.body-atabay .atabay-shell--blog-archive .ba-card-img-ph { width: 100%; height: 100%; background: linear-gradient(160deg, var(--g800, #26241f) 0%, var(--g600, #454240) 100%); display: flex; align-items: center; justify-content: center; } body.body-atabay .atabay-shell--blog-archive .ba-card-img-ph-letter { font-family: "Cormorant Garamond", serif; font-size: 64px; font-weight: 300; color: rgba(245, 244, 239, 0.07); } body.body-atabay .atabay-shell--blog-archive .ba-card-body { padding: 32px 32px 28px; flex: 1; display: flex; flex-direction: column; } body.body-atabay .atabay-shell--blog-archive .ba-card-meta { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; flex-wrap: wrap; } body.body-atabay .atabay-shell--blog-archive .ba-card-cat { font-size: 9px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--g300, #929290); font-family: "Syne", sans-serif; font-weight: 700; border: 1px solid var(--line, rgba(245, 244, 239, 0.1)); padding: 4px 12px; transition: color 0.3s, border-color 0.3s; } body.body-atabay .atabay-shell--blog-archive a.ba-card:hover .ba-card-cat { color: var(--g200, #b8b7b0); border-color: rgba(245, 244, 239, 0.2); } body.body-atabay .atabay-shell--blog-archive .ba-card-date { font-size: 10px; letter-spacing: 0.08em; color: var(--g400, #6a6a68); font-family: "Syne", sans-serif; } body.body-atabay .atabay-shell--blog-archive .ba-card-title { font-family: "Cormorant Garamond", serif; font-size: 22px; font-weight: 400; line-height: 1.25; color: var(--white, #f5f4ef); margin: 0 0 16px; transition: color 0.3s; flex: 1; } body.body-atabay .atabay-shell--blog-archive a.ba-card:hover .ba-card-title { color: var(--g100, #d8d7cf); } body.body-atabay .atabay-shell--blog-archive .ba-card-excerpt { font-size: 13px; line-height: 1.75; color: var(--g400, #6a6a68); margin-bottom: 24px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } body.body-atabay .atabay-shell--blog-archive .ba-card-footer { display: flex; justify-content: space-between; align-items: center; border-top: 1px solid var(--line, rgba(245, 244, 239, 0.1)); padding-top: 20px; margin-top: auto; } body.body-atabay .atabay-shell--blog-archive .ba-card-read { font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--g400, #6a6a68); font-family: "Syne", sans-serif; font-weight: 600; } body.body-atabay .atabay-shell--blog-archive .ba-card-arrow { font-size: 18px; color: var(--g400, #6a6a68); transition: transform 0.35s, color 0.3s; line-height: 1; } body.body-atabay .atabay-shell--blog-archive a.ba-card:hover .ba-card-arrow { transform: translate(4px, -4px); color: var(--white, #f5f4ef); } /* ─── LIST ROW ─── */ body.body-atabay .atabay-shell--blog-archive .ba-list { display: grid; grid-template-columns: 1fr 1fr; gap: 3px; margin-bottom: 3px; } body.body-atabay .atabay-shell--blog-archive a.ba-list-item { background: var(--g800, #26241f); padding: 36px 40px; display: grid; grid-template-columns: 120px 1fr; gap: 28px; align-items: start; cursor: none; position: relative; overflow: hidden; transition: background 0.35s; color: inherit; text-decoration: none; } @media (max-width: 1100px) { body.body-atabay .atabay-shell--blog-archive a.ba-list-item { cursor: auto; } } body.body-atabay .atabay-shell--blog-archive a.ba-list-item:hover { background: var(--ink, #15130f); } body.body-atabay .atabay-shell--blog-archive .ba-list-img { width: 120px; height: 90px; overflow: hidden; flex-shrink: 0; } body.body-atabay .atabay-shell--blog-archive .ba-list-img img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.6s cubic-bezier(0.77, 0, 0.18, 1); } body.body-atabay .atabay-shell--blog-archive a.ba-list-item:hover .ba-list-img img { transform: scale(1.07); } body.body-atabay .atabay-shell--blog-archive .ba-list-img-ph { width: 100%; height: 100%; background: linear-gradient(160deg, var(--g600, #454240) 0%, var(--g800, #26241f) 100%); display: flex; align-items: center; justify-content: center; } body.body-atabay .atabay-shell--blog-archive .ba-list-img-ph-letter { font-family: "Cormorant Garamond", serif; font-size: 36px; font-weight: 300; color: rgba(245, 244, 239, 0.1); } body.body-atabay .atabay-shell--blog-archive .ba-list-cat { font-size: 9px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--g400, #6a6a68); font-family: "Syne", sans-serif; font-weight: 700; margin-bottom: 8px; } body.body-atabay .atabay-shell--blog-archive .ba-list-title { font-family: "Cormorant Garamond", serif; font-size: 18px; font-weight: 400; line-height: 1.3; color: var(--white, #f5f4ef); margin: 0 0 10px; transition: color 0.3s; } body.body-atabay .atabay-shell--blog-archive a.ba-list-item:hover .ba-list-title { color: var(--g100, #d8d7cf); } body.body-atabay .atabay-shell--blog-archive .ba-list-date { font-size: 10px; color: var(--g400, #6a6a68); letter-spacing: 0.06em; font-family: "Syne", sans-serif; } /* ─── PAGINATION ─── */ body.body-atabay .atabay-shell--blog-archive .ba-pagination { display: flex; justify-content: center; align-items: center; gap: 8px; padding: 60px 0 20px; } body.body-atabay .atabay-shell--blog-archive .ba-pagination ul { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; list-style: none; margin: 0; padding: 0; } body.body-atabay .atabay-shell--blog-archive .ba-pagination li { display: inline-flex; } body.body-atabay .atabay-shell--blog-archive .ba-pagination a, body.body-atabay .atabay-shell--blog-archive .ba-pagination span.page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; height: 44px; padding: 0 10px; border: 1px solid var(--line, rgba(245, 244, 239, 0.1)); color: var(--white, #f5f4ef); font-size: 13px; font-family: "Syne", sans-serif; font-weight: 600; text-decoration: none; transition: background 0.3s, border-color 0.3s; } body.body-atabay .atabay-shell--blog-archive .ba-pagination a:hover, body.body-atabay .atabay-shell--blog-archive .ba-pagination span.page-numbers.current { background: var(--white, #f5f4ef); border-color: var(--white, #f5f4ef); color: var(--ink, #15130f); } /* ─── NEWSLETTER BAND (koyu bant — page-bands / CTA ile uyumlu) ─── */ body.body-atabay .atabay-shell--light.atabay-shell--page-bands.atabay-shell--blog-archive > .nl-band { background: var(--ink, #15130f); padding: clamp(56px, 7vw, 80px) 0; border-top: 1px solid var(--line, rgba(245, 244, 239, 0.1)); border-bottom: 1px solid var(--line, rgba(245, 244, 239, 0.1)); width: 100%; max-width: none; margin-left: 0; margin-right: 0; box-sizing: border-box; } body.body-atabay .atabay-shell--blog-archive .nl-inner { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center; width: min(100%, var(--atabay-site-max-width, 1280px)); padding-left: clamp(20px, 2.2vw, 64px); padding-right: clamp(20px, 2.2vw, 64px); margin-left: auto; margin-right: auto; box-sizing: border-box; } /* Footer: tam genişlik koyu bant, içerik site genişliğinde (atabay.css 1.8fr×3 grid ile çakışmasın) */ body.body-atabay .atabay-shell--page-bands.atabay-shell--blog-archive > footer.atabay-site-footer { width: 100%; max-width: none; padding-left: 0; padding-right: 0; box-sizing: border-box; } body.body-atabay .atabay-shell--page-bands.atabay-shell--blog-archive footer .footer-top, body.body-atabay .atabay-shell--page-bands.atabay-shell--blog-archive footer .footer-bottom { width: min(100%, var(--atabay-site-max-width, 1280px)); padding-left: clamp(20px, 2.2vw, 64px); padding-right: clamp(20px, 2.2vw, 64px); margin-left: auto; margin-right: auto; box-sizing: border-box; } @media (min-width: 1101px) { body.body-atabay .atabay-shell--page-bands.atabay-shell--blog-archive footer .footer-top { grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.1fr); } } body.body-atabay .atabay-shell--light.atabay-shell--page-bands.atabay-shell--blog-archive .nl-tag { font-size: 10px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--g300, #929290); margin-bottom: 16px; display: flex; align-items: center; gap: 12px; font-family: "Syne", sans-serif; font-weight: 600; } body.body-atabay .atabay-shell--light.atabay-shell--page-bands.atabay-shell--blog-archive .nl-tag::before { content: ""; width: 18px; height: 1px; background: var(--g300, #929290); } body.body-atabay .atabay-shell--light.atabay-shell--page-bands.atabay-shell--blog-archive .nl-title { font-family: "Cormorant Garamond", serif; font-size: clamp(32px, 4vw, 52px); font-weight: 300; line-height: 0.95; margin: 0; color: var(--white, #f5f4ef); } body.body-atabay .atabay-shell--light.atabay-shell--page-bands.atabay-shell--blog-archive .nl-title em { font-style: italic; color: var(--g300, #929290); } body.body-atabay .atabay-shell--blog-archive .nl-form { display: flex; gap: 0; } body.body-atabay .atabay-shell--light.atabay-shell--page-bands.atabay-shell--blog-archive .nl-input { flex: 1; background: rgba(245, 244, 239, 0.04); border: 1px solid var(--line, rgba(245, 244, 239, 0.1)); border-right: none; color: var(--white, #f5f4ef); padding: 16px 20px; font-size: 14px; font-family: "DM Sans", sans-serif; outline: none; transition: border-color 0.3s; } body.body-atabay .atabay-shell--light.atabay-shell--page-bands.atabay-shell--blog-archive .nl-input::placeholder { color: var(--g400, #6a6a68); } body.body-atabay .atabay-shell--light.atabay-shell--page-bands.atabay-shell--blog-archive .nl-input:focus { border-color: rgba(245, 244, 239, 0.35); } body.body-atabay .atabay-shell--blog-archive .nl-submit { background: var(--accent, #ba9a5b); color: var(--ink, #15130f); border: none; padding: 16px 28px; font-size: 10px; letter-spacing: 0.16em; text-transform: uppercase; font-weight: 700; cursor: none; transition: background 0.3s; font-family: "Syne", sans-serif; white-space: nowrap; flex-shrink: 0; } @media (max-width: 1100px) { body.body-atabay .atabay-shell--blog-archive .nl-submit { cursor: auto; } } body.body-atabay .atabay-shell--blog-archive .nl-submit:hover { background: var(--accent-light, #c9b685); } body.body-atabay .atabay-shell--light.atabay-shell--page-bands.atabay-shell--blog-archive .nl-note { font-size: 11px; color: var(--g400, #6a6a68); margin-top: 12px; } /* ─── RESPONSIVE ─── */ @media (max-width: 1100px) { body.body-atabay .atabay-shell--page-bands.atabay-shell--blog-archive .blog-archive { padding: 48px 24px; } body.body-atabay .atabay-shell--page-bands.atabay-shell--blog-archive > footer.atabay-site-footer { padding-top: 48px !important; padding-bottom: 28px !important; padding-left: 0 !important; padding-right: 0 !important; } body.body-atabay .atabay-shell--blog-archive footer .footer-top, body.body-atabay .atabay-shell--blog-archive footer .footer-bottom { padding-left: 20px; padding-right: 20px; } body.body-atabay .atabay-shell--blog-archive a.ba-featured { grid-template-columns: 1fr; } body.body-atabay .atabay-shell--blog-archive .ba-feat-img, body.body-atabay .atabay-shell--blog-archive .ba-feat-img-placeholder { min-height: 280px; } body.body-atabay .atabay-shell--blog-archive .ba-feat-content { padding: 36px 32px; } body.body-atabay .atabay-shell--blog-archive .ba-grid { grid-template-columns: 1fr; } body.body-atabay .atabay-shell--blog-archive a.ba-card { min-width: 0; } body.body-atabay .atabay-shell--blog-archive .ba-card-title { overflow-wrap: break-word; word-break: normal; } body.body-atabay .atabay-shell--blog-archive .ba-list { grid-template-columns: 1fr; } body.body-atabay .atabay-shell--light.atabay-shell--page-bands.atabay-shell--blog-archive > .nl-band { padding: 64px 0; } body.body-atabay .atabay-shell--blog-archive .nl-inner { grid-template-columns: 1fr; gap: 40px; } } @media (max-width: 640px) { body.body-atabay .atabay-shell--page-bands.atabay-shell--blog-archive .blog-archive { padding: 40px 20px; } body.body-atabay .atabay-shell--page-bands.atabay-shell--blog-archive > footer.atabay-site-footer { padding-top: 36px !important; padding-bottom: 22px !important; padding-left: 0 !important; padding-right: 0 !important; } body.body-atabay .atabay-shell--blog-archive footer .footer-top, body.body-atabay .atabay-shell--blog-archive footer .footer-bottom { padding-left: 16px; padding-right: 16px; } body.body-atabay .atabay-shell--blog-archive .ba-toolbar { flex-direction: column; align-items: flex-start; } body.body-atabay .atabay-shell--blog-archive .ba-feat-img, body.body-atabay .atabay-shell--blog-archive .ba-feat-img-placeholder { min-height: 220px; } body.body-atabay .atabay-shell--blog-archive .ba-feat-content { padding: 28px 24px; } body.body-atabay .atabay-shell--blog-archive .ba-feat-title { font-size: clamp(22px, 7vw, 34px); } body.body-atabay .atabay-shell--blog-archive .ba-grid { grid-template-columns: 1fr; } body.body-atabay .atabay-shell--blog-archive a.ba-list-item { grid-template-columns: 1fr; gap: 16px; padding: 28px 24px; } body.body-atabay .atabay-shell--blog-archive .ba-list-img { width: 100%; height: 160px; } body.body-atabay .atabay-shell--light.atabay-shell--page-bands.atabay-shell--blog-archive > .nl-band { padding: 56px 0; } body.body-atabay .atabay-shell--blog-archive .nl-form { flex-direction: column; } body.body-atabay .atabay-shell--blog-archive .nl-input { border-right: 1px solid var(--line, rgba(245, 244, 239, 0.1)); } body.body-atabay .atabay-shell--blog-archive .nl-submit { width: 100%; padding: 16px; } body.body-atabay .atabay-shell--blog-archive .ba-cats { gap: 6px; } body.body-atabay .atabay-shell--blog-archive a.ba-cat-btn { padding: 7px 14px; font-size: 9px; } }