/* Pastane v2: pastane.css üstüne gelir, yalnızca hero ve yazı karakterini değiştirir. */
:root {
  --fg: #2A1B14;
  --display: Fraunces, Georgia, serif;
  --strip-bg: #2A1B14;
  --line: rgba(42, 27, 20, .16);
}

/* %3,5 sıcak un dokusu: gren kahve tonuna çekildi */
body::after {
  opacity: .035;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .42 0 0 0 0 .26 0 0 0 0 .14 0 0 0 1.1 -.1'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

.v2 { --i: 4.3; --r: min(240px, 38vw); background: var(--bg); color: var(--fg); overflow-x: clip; padding-top: 26px; }
.v2-head { text-align: center; }

/* Canlı fırın durumu */
.status {
  display: inline-flex; align-items: center; gap: 10px; max-width: 100%;
  padding: 7px 16px 7px 8px; border: 1px solid rgba(42, 27, 20, .2); border-radius: 999px; background: #F3EADD;
  font-size: .8125rem; font-weight: 600; line-height: 1.3; text-align: left;
}
.status-ic { position: relative; flex: none; width: 28px; height: 28px; display: grid; place-content: center; border-radius: 50%; background: rgba(200, 125, 85, .24); font-size: .875rem; line-height: 1; }
.status-ic::before {
  content: ""; position: absolute; inset: 0; border-radius: 50%; background: #E8913F; z-index: 0;
  animation: firin 2.2s ease-out infinite;
}
.status-ic span { position: relative; z-index: 1; }
@keyframes firin { 0% { transform: scale(.75); opacity: .55; } 80%, 100% { transform: scale(1.5); opacity: 0; } }
.status[data-state="closed"] .status-ic::before { animation: none; opacity: 0; }
.status[data-state="closed"] .status-ic { background: rgba(42, 27, 20, .12); }

.v2-title {
  margin: 18px auto 0; max-width: 11.5em;
  font-family: var(--display); font-weight: 400; font-variation-settings: "opsz" 144, "SOFT" 40;
  font-size: clamp(2.875rem, 13.4vw, 9.25rem); line-height: .98; letter-spacing: -.02em; text-wrap: balance;
}

/* Kemerli vitrin */
.arch-stage { position: relative; margin-top: 26px; }
.arch-clip {
  position: relative; height: clamp(380px, 112vw, 520px); background: #EADFCF; overflow: hidden;
  clip-path: inset(0 calc(var(--i) * 1vw) round var(--r) var(--r) 24px 24px);
}
.arch-clip img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity .55s ease; }
.arch-clip img.is-on { opacity: 1; }

/* Dairesel mühür */
.seal { position: absolute; z-index: 2; top: -18px; right: max(8px, calc(var(--i) * 1vw - 8px)); width: 96px; height: 96px; }
.seal-scroll, .seal-spin { display: block; width: 100%; height: 100%; }
.seal-spin { animation: muhur 26s linear infinite; }
@keyframes muhur { to { transform: rotate(360deg); } }
.seal svg { display: block; width: 100%; height: 100%; }
.seal-center { position: absolute; inset: 0; display: grid; place-content: center; color: var(--bg); font-family: var(--display); font-size: 1.375rem; font-weight: 500; letter-spacing: -.02em; }

/* Bugünün çıktıları */
.picker { position: relative; z-index: 2; margin: -44px 16px 0; padding: 12px; background: var(--bg); border: 1px solid rgba(42, 27, 20, .14); border-radius: 18px; }
.picker-tabs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; }
.pick { display: grid; gap: 1px; min-height: 52px; padding: 7px 8px; border-radius: 12px; text-align: left; line-height: 1.2; transition: background-color .2s, color .2s; }
.pick b { font-family: var(--display); font-weight: 500; font-size: 1.0625rem; font-variant-numeric: tabular-nums; }
.pick span { font-size: .8125rem; font-weight: 500; }
.pick:hover { background: rgba(200, 125, 85, .16); }
.pick[aria-pressed="true"] { background: var(--fg); color: var(--bg); }
.picker-note { margin-top: 10px; padding: 0 6px 4px; font-size: .9375rem; line-height: 1.45; color: rgba(42, 27, 20, .86); min-height: 4.35em; }

.v2-foot { display: grid; gap: 18px; padding-block: 26px 44px; }
.v2-foot p { max-width: 34rem; font-size: 1.0625rem; color: rgba(42, 27, 20, .84); }
.v2-cta { display: flex; flex-wrap: wrap; gap: 10px; }
.v2 .btn-cin { background: var(--fg); color: var(--bg); }
.v2 .btn-cin:hover { background: var(--cin-d); }
.v2 .btn-line { border: 1px solid rgba(42, 27, 20, .35); }
.v2 .btn-line:hover { border-color: var(--fg); }

/* Sıcak krem hero'dan sonra saatler bölümü koyu kalır, ek kenarlık gerekmez */
.trays { background: var(--fg); border-top: 0; }

@media (min-width: 768px) {
  .v2 { --i: 10; }
  .status { font-size: .875rem; padding-right: 20px; }
  .arch-clip { height: clamp(460px, 68vw, 620px); }
  .seal { width: 124px; height: 124px; top: -24px; right: calc(var(--i) * 1vw - 22px); }
  .seal-center { font-size: 1.75rem; }
  .picker { position: absolute; right: calc(var(--i) * 1vw + 20px); bottom: 20px; width: 380px; margin: 0; }
  .v2-foot { grid-template-columns: 1fr auto; align-items: center; }
}
@media (min-width: 1024px) {
  .v2 { --i: 14; padding-top: 34px; }
  .v2-title { margin-top: 22px; font-size: clamp(5rem, 9.4vw, 9.25rem); }
  .arch-stage { margin-top: 34px; }
  .arch-clip { height: clamp(460px, 76vh, 780px); }
  .seal { width: 148px; height: 148px; top: -30px; }
  .seal-center { font-size: 2.125rem; }
  .v2-foot { padding-block: 34px 72px; }
}
@media (prefers-reduced-motion: reduce) {
  .status-ic::before, .seal-spin { animation: none; }
}
