/* =========================================================
   Adore Ceramics · v5 blog (Atölye Notları) · galeri düzeni
   ========================================================= */
.eyebrow { font-size: .72rem; font-weight: 500; letter-spacing: .18em; text-transform: uppercase; color: var(--ink); }

.page-hero { padding: clamp(8rem, 15vw, 12rem) var(--pad) clamp(3rem, 6vw, 5rem); border-bottom: 1px solid var(--line); }
.page-hero .wrap, .post-layout, .post-related, .blog-list, .post-cover { width: auto; margin: 0; }
.crumbs { display: flex; flex-wrap: wrap; gap: .6rem; font-size: .7rem; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-2); margin-bottom: 2.4rem; }
.crumbs a { color: var(--ink); }
.page-hero .eyebrow { display: block; margin-bottom: 1.4rem; }
.post-title { font-size: clamp(2.4rem, 6.4vw, 6.2rem); line-height: .98; max-width: 16ch; }
.post-title em { font-size: .8em; }
.page-hero-lead { margin-top: 1.6rem; max-width: 50ch; font-size: 1rem; }
.post-byline { display: flex; flex-wrap: wrap; gap: .4rem 2.4rem; margin-top: 2.2rem; font-size: .74rem; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-2); }
.post-byline b { color: var(--ink); font-weight: 500; }

.post-cover { padding: clamp(1.5rem, 3vw, 2.5rem) var(--pad) 0; }
.post-cover picture { display: block; overflow: hidden; background: var(--paper-2); }
.post-cover img { width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; }

.post-layout { display: grid; grid-template-columns: minmax(0, 15rem) minmax(0, 1fr); gap: clamp(2rem, 6vw, 7rem); padding: clamp(3rem, 7vw, 6rem) var(--pad); align-items: start; }
.post-toc { position: sticky; top: 6rem; font-size: .8rem; }
.post-toc-k, .post-note-k, .post-author-k { display: block; font-size: .66rem; font-weight: 500; letter-spacing: .18em; text-transform: uppercase; color: var(--ink); margin-bottom: 1rem; }
.post-toc ol { border-top: 1px solid var(--line); }
.post-toc li a { display: block; padding: .6rem 0; border-bottom: 1px solid var(--line); color: var(--ink-2); line-height: 1.35; transition: color .3s, padding-left .5s var(--ease); }
.post-toc li a:hover, .post-toc li a.on { color: var(--ink); padding-left: .5rem; }

.post-body { max-width: 680px; font-size: 1.04rem; line-height: 1.85; }
.post-body > * + * { margin-top: 1.2em; }
.post-lead { font-family: var(--serif); font-size: clamp(1.35rem, 2vw, 1.7rem); line-height: 1.4; color: var(--ink); }
.post-body h2 { font-size: clamp(1.7rem, 3vw, 2.5rem); line-height: 1.02; margin-top: 2.4em; scroll-margin-top: 6rem; }
.post-body h3 { font-size: clamp(1.15rem, 1.6vw, 1.35rem); line-height: 1.2; margin-top: 1.8em; letter-spacing: .04em; }
.post-body h2 + p, .post-body h3 + p { margin-top: .8em; }
.post-body a:not(.btn):not(.bp-card) { color: var(--ink); border-bottom: 1px solid var(--line); transition: border-color .3s; }
.post-body a:not(.btn):not(.bp-card):hover { border-color: var(--ink); }
.post-body ul > li, .post-body ol > li { position: relative; padding-left: 1.6rem; color: var(--ink-2); }
.post-body ul > li::before { content: ""; position: absolute; left: 0; top: .9em; width: .7rem; height: 1px; background: var(--ink); }
.post-body ol { counter-reset: adim; }
.post-body ol > li { counter-increment: adim; padding-left: 2.2rem; }
.post-body ol > li::before { content: counter(adim, decimal-leading-zero); position: absolute; left: 0; top: .1em; font-family: var(--serif); font-size: .9rem; color: var(--ink); }
.post-body li + li { margin-top: .6em; }
.post-body strong { font-weight: 500; color: var(--ink); }

.post-fig { margin: 2.6em 0; }
.post-fig picture { display: block; overflow: hidden; background: var(--paper-2); }
.post-fig img { width: 100%; height: auto; max-height: 620px; object-fit: contain; }
.post-fig figcaption { margin-top: .7rem; font-size: .72rem; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-2); }

.post-note { margin: 2.4em 0; padding: 1.4rem 0 1.4rem 1.6rem; border-left: 1px solid var(--ink); }
.post-note p { color: var(--ink); }

.bp-products { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.6rem 1rem; margin: 2.6em 0; }
.bp-card { display: grid; gap: .5rem; align-content: start; }
.bp-media { display: block; aspect-ratio: 4 / 5; overflow: hidden; background: var(--paper-2); }
.bp-media img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.4s var(--ease); }
.bp-card:hover .bp-media img { transform: scale(1.05); }
.bp-name { font-family: var(--serif); text-transform: uppercase; font-size: .88rem; letter-spacing: .06em; line-height: 1.3; color: var(--ink); }
.bp-meta { display: flex; justify-content: space-between; gap: .5rem; font-size: .8rem; }
.bp-price { color: var(--ink); }
.bp-cta { font-size: .64rem; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-2); display: inline-flex; gap: .3rem; align-items: center; }

.post-faq { margin-top: 3.6em !important; }
.post-faq h2 { margin: 0 0 1.4rem; }
.post-faq .faq-item summary h3 { margin-top: 0; }
.post-author { display: flex; gap: 1.2rem; align-items: center; margin-top: 3em !important; padding: 1.4rem 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.post-author img { width: 64px; height: 84px; object-fit: cover; flex: none; filter: saturate(.85); }
.post-author b { display: block; font-family: var(--serif); text-transform: uppercase; font-size: 1.1rem; font-weight: 400; letter-spacing: .06em; }
.post-author p { font-size: .88rem; }
.post-cta { margin-top: 2.6em !important; padding: clamp(1.8rem, 4vw, 3rem); background: var(--dark); color: var(--on-dark); display: grid; gap: 1.4rem; }
.post-cta h2 { margin: 0; font-size: clamp(1.8rem, 3.4vw, 2.8rem); color: var(--on-dark); }
.post-cta p { color: var(--on-dark-2); margin-top: .5rem; }
.post-cta-btns { display: flex; flex-wrap: wrap; gap: .8rem; }

.post-related { padding: clamp(4rem, 8vw, 7rem) var(--pad); border-top: 1px solid var(--line); }
.post-related .h2 { font-size: clamp(2.2rem, 5vw, 4.4rem); margin-bottom: 2.4rem; }
.blog-list { padding: clamp(3rem, 6vw, 5rem) var(--pad) clamp(5rem, 10vw, 8rem); }
.post-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(2rem, 4vw, 3rem) clamp(1rem, 2vw, 2rem); }
.post-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.post-card { display: grid; gap: 1rem; align-content: start; }
.post-card-media { display: block; aspect-ratio: 3 / 2; overflow: hidden; background: var(--paper-2); }
.post-card-media img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.4s var(--ease); }
.post-card:hover .post-card-media img { transform: scale(1.05); }
.post-card-body { display: grid; gap: .6rem; }
.post-card-meta { font-size: .68rem; letter-spacing: .16em; text-transform: uppercase; color: var(--ink-2); }
.post-card h2, .post-card h3 { font-size: clamp(1.25rem, 1.8vw, 1.6rem); line-height: 1.12; }
.post-card p { font-size: .9rem; }
.arrow-link { font-size: .68rem; letter-spacing: .18em; text-transform: uppercase; display: inline-flex; gap: .5rem; align-items: center; color: var(--ink); border-bottom: 1px solid var(--ink); padding-bottom: .25rem; width: fit-content; }

/* blog sayfasında alt bilgi (üretici işaretlemesi) */
.site-footer .wrap { width: auto; margin: 0; }
.footer-top { display: grid; grid-template-columns: 1.4fr repeat(3, minmax(0, 1fr)); gap: 2rem; padding-top: 2rem; border-top: 1px solid var(--line-dark); }
.footer-brand .logo-img { height: 44px; width: auto; margin-bottom: 1rem; }
.footer-brand p { color: var(--on-dark-2); font-size: .9rem; max-width: 30ch; }

@media (max-width: 1024px) {
  .post-layout { grid-template-columns: minmax(0, 1fr); }
  .post-toc { position: static; }
  .post-body { max-width: none; }
}
@media (max-width: 760px) {
  .bp-products { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bp-cta { display: none; }
  .post-grid, .post-grid--2 { grid-template-columns: minmax(0, 1fr); }
  .footer-top { grid-template-columns: 1fr 1fr; }
  .post-author { flex-direction: column; align-items: flex-start; }
}

/* =========================================================
   Ürün sayfası (/urun/<ad>/) ve tüm ürünler (/urunler/)
   ========================================================= */
.pp { padding-top: clamp(5.5rem, 9vw, 7rem); }
.pp-top { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: clamp(2rem, 5vw, 5rem); padding: clamp(1.5rem, 3vw, 2.5rem) var(--pad) clamp(3rem, 6vw, 5rem); align-items: start; }
.pp-gallery { position: sticky; top: 6.5rem; display: grid; gap: .8rem; }
.pp-main { margin: 0; aspect-ratio: 1 / 1; overflow: hidden; background: var(--paper-2); }
.pp-main img { width: 100%; height: 100%; object-fit: cover; transition: opacity .35s var(--ease); }
.pp-thumbs { display: flex; flex-wrap: wrap; gap: .5rem; }
.pp-thumb { width: 64px; height: 64px; padding: 0; border: 1px solid transparent; background: var(--paper-2); overflow: hidden; cursor: pointer; transition: border-color .3s; }
.pp-thumb img { width: 100%; height: 100%; object-fit: cover; }
.pp-thumb[aria-pressed="true"], .pp-thumb:hover { border-color: var(--ink); }
.pp-info { display: grid; gap: 1.3rem; align-content: start; justify-items: start; }
.pp-info .crumbs { margin-bottom: .2rem; }
.pp-title { font-size: clamp(2rem, 4.2vw, 3.6rem); line-height: 1.02; max-width: 18ch; }
.pp-price { font-family: var(--serif); font-size: 1.5rem; color: var(--ink); }
.pp-opts { display: flex; flex-wrap: wrap; gap: .45rem; }
.pp-opts-k { flex-basis: 100%; font-size: .7rem; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-2); }
.pp-opts-k b { color: var(--ink); font-weight: 500; }
.pp-opt { font: inherit; font-size: .82rem; min-height: 44px; padding: .55em 1.1em; border: 1px solid var(--line); background: transparent; color: var(--ink); cursor: pointer; transition: border-color .3s, background-color .3s, color .3s; }
.pp-opt:hover { border-color: var(--ink); }
.pp-opt[aria-pressed="true"] { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.pp-lead { font-size: 1.04rem; line-height: 1.7; max-width: 52ch; }
.pp-cta { display: flex; flex-wrap: wrap; gap: .7rem; }
.pp-facts { display: grid; gap: .45rem; width: 100%; padding-top: 1.1rem; border-top: 1px solid var(--line); font-size: .86rem; color: var(--ink-2); }
.pp-facts li { position: relative; padding-left: 1.4rem; }
.pp-facts li::before { content: ""; position: absolute; left: 0; top: .78em; width: .7rem; height: 1px; background: var(--ink); }
.pp-body { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); gap: clamp(2rem, 6vw, 6rem); padding: clamp(3rem, 6vw, 5rem) var(--pad); border-top: 1px solid var(--line); }
.pp-desc { max-width: 680px; font-size: 1.04rem; line-height: 1.85; }
.pp-desc > * + * { margin-top: 1.1em; }
.pp-desc h2, .pp-spec h2 { font-size: clamp(1.5rem, 2.6vw, 2.2rem); line-height: 1.05; }
.pp-desc h2:not(:first-child) { margin-top: 2em; }
.pp-spec { display: grid; gap: .9rem; align-content: start; font-size: .92rem; }
.pp-spec ul { border-top: 1px solid var(--line); }
.pp-spec li { padding: .65rem 0; border-bottom: 1px solid var(--line); color: var(--ink); }
.pp-spec h3 { margin-top: 1rem; font-family: var(--sans); font-size: .72rem; font-weight: 500; letter-spacing: .16em; text-transform: uppercase; color: var(--ink); }
.pp-all { margin-top: 2.2rem; }

.pl-cats { display: flex; flex-wrap: wrap; gap: .45rem; margin-top: 2.2rem; }
.pl-cats a { font-size: .74rem; letter-spacing: .06em; padding: .6em 1.05em; border: 1px solid var(--line); color: var(--ink); transition: border-color .3s, background-color .3s, color .3s; }
.pl-cats a:hover, .pl-cats a:focus-visible { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.pl-sec { padding: clamp(3rem, 6vw, 5rem) var(--pad); border-top: 1px solid var(--line); scroll-margin-top: 5.5rem; }
.pl-head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 1rem 3rem; align-items: end; margin-bottom: 2rem; }
.pl-head h2 { font-size: clamp(1.9rem, 4vw, 3.4rem); line-height: 1; }
.pl-head p { max-width: 52ch; font-size: .95rem; }
.pl-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(1.6rem, 3vw, 2.4rem) clamp(.8rem, 1.6vw, 1.4rem); }
.pl-card { display: grid; gap: .55rem; align-content: start; color: var(--ink); }
.pl-media { display: block; aspect-ratio: 1 / 1; overflow: hidden; background: var(--paper-2); }
.pl-media img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.4s var(--ease); }
.pl-card:hover .pl-media img { transform: scale(1.05); }
.pl-name { font-family: var(--serif); font-size: .95rem; font-weight: 400; line-height: 1.25; letter-spacing: .05em; text-transform: uppercase; }
.pl-meta { display: flex; justify-content: space-between; gap: .6rem; font-size: .78rem; color: var(--ink-2); }
.pl-price { color: var(--ink); white-space: nowrap; }

@media (max-width: 1024px) { .pl-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 900px) {
  .pp-top, .pp-body { grid-template-columns: minmax(0, 1fr); }
  .pp-gallery { position: static; }
}
@media (max-width: 760px) {
  .pl-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pl-head { grid-template-columns: minmax(0, 1fr); }
  .pl-meta { flex-direction: column; gap: .1rem; }
  .pp-cta { width: 100%; }
  .pp-cta .btn { flex: 1 1 auto; }
}
@media (max-width: 760px) {
  .pp-thumbs { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
  .pp-thumb { flex: none; width: 54px; height: 54px; }
}
