/* Commerce Core — ana sayfa düzen katmanı. Renkler aktif temanın token'larından gelir
   (admin > Tema); burada sabit marka rengi kullanılmaz. */
body.premium-home { background: var(--color-bg, #f7f7f8); }
.header { border-bottom-color: color-mix(in srgb, var(--color-heading, #111) 10%, transparent); background: color-mix(in srgb, var(--color-bg, #fff) 88%, transparent); }
.header__logo a { color: var(--color-heading, #111); font-family: var(--font-heading, Georgia, serif); font-weight: 650; letter-spacing: -.025em; }
.header__nav a { color: var(--color-secondary, #555); }
.header__nav a:hover,
.header__nav a.active { color: var(--color-heading, #111); }

.hero { min-height: 650px; grid-template-columns: minmax(420px, .82fr) minmax(0, 1.18fr); border: 1px solid var(--color-border, #e5e5e5); background: color-mix(in srgb, var(--color-accent, #06f) 8%, var(--color-surface, #f7f7f8)); box-shadow: 0 30px 80px color-mix(in srgb, var(--color-heading, #111) 10%, transparent); }
.hero__content { min-width: 0; min-height: 650px; padding: clamp(44px, 5vw, 72px); }
.hero__inner { width: 100%; min-width: 0; max-width: 520px; }
.hero__tag { border-color: var(--color-border, #e5e5e5); background: color-mix(in srgb, var(--color-bg, #fff) 60%, transparent); color: var(--color-secondary, #555); }
.hero__tag::before { background: var(--color-accent, #06f); box-shadow: 0 0 0 5px color-mix(in srgb, var(--color-accent, #06f) 14%, transparent); }
.hero__title { inline-size: min(100%, 10ch); max-width: 100%; color: var(--color-heading, #111); font-family: var(--font-heading, Georgia, serif); font-size: clamp(3rem, 4.75vw, 4.9rem); font-weight: 600; line-height: .98; letter-spacing: -.05em; text-wrap: balance; }
.hero__desc { max-width: 540px; color: var(--color-secondary, #555); font-size: 1.04rem; }
.hero .btn--gold { background: var(--color-primary, #111); color: #fff; box-shadow: 0 12px 24px color-mix(in srgb, var(--color-primary, #111) 22%, transparent); }
.hero .btn--gold:hover { background: var(--color-accent, #06f); }
.hero .btn--outline { border-color: color-mix(in srgb, var(--color-heading, #111) 20%, transparent) !important; background: color-mix(in srgb, var(--color-bg, #fff) 50%, transparent); color: var(--color-heading, #111) !important; }
.hero .btn--outline:hover { background: var(--color-bg, #fff); }
.hero__stats { border-color: var(--color-border, #e5e5e5); }
.hero__stat b { color: var(--color-heading, #111); }
.hero__stat span { color: var(--color-secondary, #555); }
.hero__visual { min-height: 650px; padding: 0; display: block; overflow: hidden; }
.hero__visual::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, color-mix(in srgb, var(--color-surface, #f7f7f8) 30%, transparent), transparent 25%); pointer-events: none; }
.hero__visual > picture { display: block; width: 100%; height: 100%; min-height: 650px; }
.hero__visual > picture > img { display: block; width: 100%; height: 100%; min-height: 650px; object-fit: cover; object-position: 58% center; }
.hero-craft-note { position: absolute; right: 26px; bottom: 26px; z-index: 2; display: grid; grid-template-columns: auto 1fr; column-gap: 12px; min-width: 260px; padding: 16px 18px; border: 1px solid rgba(255,255,255,.45); border-radius: 16px; background: color-mix(in srgb, var(--color-bg, #fff) 84%, transparent); color: var(--color-heading, #111); box-shadow: 0 16px 40px color-mix(in srgb, var(--color-heading, #111) 14%, transparent); backdrop-filter: blur(12px); }
.hero-craft-note span { grid-row: 1 / 3; align-self: center; color: var(--color-accent, #06f); font: 600 1.6rem/1 var(--font-heading, Georgia, serif); }
.hero-craft-note strong { font-size: .84rem; }
.hero-craft-note small { margin-top: 3px; color: var(--color-secondary, #555); font-size: .69rem; }

.product-card { border-color: var(--color-border, #e5e5e5); background: var(--color-bg, #fff); box-shadow: 0 10px 30px color-mix(in srgb, var(--color-heading, #111) 6%, transparent); }
.product-card__media { background: var(--color-surface, #f7f7f8); }
.product-card__media img { transition: transform .4s cubic-bezier(.2,.7,.2,1); }
.product-card:hover .product-card__media img { transform: scale(1.025); }
.section-title { font-family: var(--font-heading, Georgia, serif); font-weight: 600; letter-spacing: -.035em; }

.home-managed-sections { display: contents; }
.home-about__inner { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(280px, .95fr); gap: clamp(30px, 6vw, 84px); align-items: center; }
.home-about__copy { max-width: 680px; }
.home-about__eyebrow { display: inline-block; margin-bottom: 12px; color: var(--color-accent); font-size: .75rem; font-weight: 750; letter-spacing: .12em; text-transform: uppercase; }
.home-about__copy .section-title { margin-bottom: 18px; }
.home-about__copy p { max-width: 62ch; margin-bottom: 24px; color: var(--color-text-muted); font-size: 1rem; line-height: 1.8; }
.home-about__visual { min-height: 340px; overflow: hidden; border-radius: 24px; background: var(--color-surface, #f7f7f8); box-shadow: 0 20px 48px color-mix(in srgb, var(--color-heading, #111) 10%, transparent); }
.home-about__visual img { display: block; width: 100%; height: 100%; min-height: 340px; object-fit: cover; }
.home-about__inner:has(.home-about__visual[hidden]) { grid-template-columns: minmax(0, 760px); justify-content: center; text-align: center; }
.home-about__inner:has(.home-about__visual[hidden]) .home-about__copy { max-width: 760px; }
.home-about__inner:has(.home-about__visual[hidden]) .home-about__copy p { margin-inline: auto; }

@media (max-width: 1100px) {
  .hero { grid-template-columns: minmax(360px, .9fr) minmax(0, 1.1fr); }
}
@media (max-width: 820px) {
  .hero { grid-template-columns: 1fr; }
  .hero__content { min-height: auto; }
  .hero__visual { min-height: 340px; }
  .hero__visual > picture,
  .hero__visual > picture > img { min-height: 340px; }
  .home-about__inner { grid-template-columns: 1fr; }
}
@media (max-width: 520px) {
  .hero__title { font-size: clamp(2.5rem, 13vw, 3.45rem); }
  .hero__visual { display: block; min-height: 260px; }
  .hero__visual > picture,
  .hero__visual > picture > img { min-height: 260px; }
  .hero__visual > picture > img { object-position: 60% center; }
  .hero-craft-note { right: 14px; bottom: 14px; min-width: 220px; padding: 12px 14px; }
}
@media (prefers-reduced-motion: reduce) {
  .product-card__media img { transition: none; }
}

.newsletter__privacy { max-width: 58ch; margin: 14px auto 0; color: color-mix(in srgb, currentColor 74%, transparent); font-size: .76rem; line-height: 1.55; }
.newsletter__privacy a { color: inherit; text-underline-offset: 3px; }
.newsletter__privacy a:hover { color: var(--color-accent); }
