:root {
  --vv-warm: #f7f5f1;
  --vv-ivory: #fffdf9;
  --vv-ink: #111110;
  --vv-navy: #08111d;
  --vv-bronze: #b7a17e;
  --vv-muted: #6d6a65;
  --vv-line: #ddd8d0;
  --vv-danger: #8f342d;
  --vv-success: #356351;
  --vv-shadow: 0 24px 70px rgba(8, 17, 29, .09);
}
* { box-sizing: border-box; }
html { background: var(--vv-warm); color: var(--vv-ink); }
body { margin: 0; font-family: Inter, system-ui, sans-serif; font-size: 15px; line-height: 1.55; }
button, input, select, textarea { font: inherit; }
a { color: inherit; }
img { max-width: 100%; }
.vv-skip { position: fixed; left: 12px; top: -80px; z-index: 100; background: white; padding: 12px; }
.vv-skip:focus { top: 12px; }
.vv-commerce-header {
  min-height: 76px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center;
  padding: 0 20px; border-bottom: 1px solid var(--vv-line); background: rgba(247,245,241,.96);
  position: sticky; top: 0; z-index: 30; backdrop-filter: blur(14px);
}
.vv-commerce-header img { width: 118px; display: block; }
.vv-commerce-header .vv-back { justify-self: start; font-size: 12px; letter-spacing: .05em; }
.vv-commerce-header .vv-account { justify-self: end; font-size: 12px; }
.vv-commerce-main { width: min(1180px, calc(100% - 32px)); margin: 0 auto; padding: 50px 0 90px; }
.vv-eyebrow { color: #8c744f; text-transform: uppercase; letter-spacing: .18em; font-size: 10px; font-weight: 600; }
.vv-title { margin: 8px 0 10px; font: 300 clamp(2.15rem, 6vw, 4.5rem)/1 Fraunces, Georgia, serif; letter-spacing: -.025em; }
.vv-lead { margin: 0; max-width: 640px; color: var(--vv-muted); }
.vv-commerce-grid { display: grid; gap: 32px; margin-top: 38px; }
.vv-panel {
  border: 1px solid var(--vv-line); background: rgba(255,253,249,.88); box-shadow: 0 10px 40px rgba(8,17,29,.045);
}
.vv-panel-inner { padding: clamp(20px, 4vw, 34px); }
.vv-summary { align-self: start; }
.vv-summary h2, .vv-section-title { margin: 0 0 22px; font: 300 1.45rem Fraunces, Georgia, serif; }
.vv-summary-row { display: flex; justify-content: space-between; gap: 20px; padding: 10px 0; color: var(--vv-muted); }
.vv-summary-row strong { color: var(--vv-ink); font-weight: 500; }
.vv-summary-total { margin-top: 10px; padding-top: 18px; border-top: 1px solid var(--vv-line); font-size: 18px; }
.vv-summary-total strong { font: 400 1.45rem Fraunces, Georgia, serif; }
.vv-btn {
  min-height: 50px; width: 100%; border: 1px solid var(--vv-navy); padding: 13px 18px;
  display: inline-flex; justify-content: center; align-items: center; gap: 10px; cursor: pointer;
  background: var(--vv-navy); color: white; text-decoration: none; letter-spacing: .075em;
  text-transform: uppercase; font-size: 11px; transition: transform .2s ease, opacity .2s ease;
}
.vv-btn:hover:not(:disabled) { transform: translateY(-1px); }
.vv-btn:disabled { cursor: not-allowed; opacity: .47; }
.vv-btn-secondary { background: transparent; color: var(--vv-navy); }
.vv-btn-text { width: auto; min-height: 44px; border: 0; padding: 8px; background: transparent; color: var(--vv-muted); text-transform: none; letter-spacing: 0; }
.vv-btn-danger { color: var(--vv-danger); }
.vv-btn:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, a:focus-visible {
  outline: 3px solid rgba(183,161,126,.6); outline-offset: 3px;
}
.vv-cart-list { display: grid; gap: 16px; }
.vv-cart-item { display: grid; grid-template-columns: 100px 1fr; gap: 18px; padding: 18px; border: 1px solid var(--vv-line); background: var(--vv-ivory); }
.vv-cart-media { aspect-ratio: 3/4; overflow: hidden; background: #e8e3da; }
.vv-cart-media img { width: 100%; height: 100%; object-fit: cover; }
.vv-cart-item h2 { margin: 0; font: 300 1.35rem Fraunces, Georgia, serif; }
.vv-cart-meta { margin: 5px 0 12px; color: var(--vv-muted); font-size: 12px; }
.vv-cart-line { display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; }
.vv-quantity { display: inline-grid; grid-template-columns: 44px 48px 44px; align-items: center; border: 1px solid var(--vv-line); }
.vv-quantity button { min-width: 44px; min-height: 44px; border: 0; background: transparent; cursor: pointer; font-size: 20px; }
.vv-quantity output { text-align: center; font-variant-numeric: tabular-nums; }
.vv-money { font-variant-numeric: tabular-nums; white-space: nowrap; }
.vv-alert { padding: 14px 16px; border-left: 3px solid var(--vv-bronze); background: #f2ede4; color: #574c3c; margin: 16px 0; }
.vv-alert-error { border-color: var(--vv-danger); background: #fbefed; color: #722c27; }
.vv-alert-success { border-color: var(--vv-success); background: #edf6f1; color: #284c40; }
.vv-empty { text-align: center; padding: 64px 24px; border: 1px solid var(--vv-line); background: var(--vv-ivory); }
.vv-empty h2 { font: 300 clamp(1.8rem, 5vw, 2.7rem) Fraunces, Georgia, serif; }
.vv-empty .vv-btn { max-width: 280px; margin-top: 18px; }
.vv-skeleton { min-height: 160px; background: linear-gradient(90deg,#eee8df 25%,#f8f4ed 50%,#eee8df 75%); background-size: 200% 100%; animation: vv-shimmer 1.3s infinite; }
@keyframes vv-shimmer { to { background-position: -200% 0; } }
.vv-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; margin: 30px 0; background: var(--vv-line); border: 1px solid var(--vv-line); }
.vv-step { padding: 14px 8px; background: var(--vv-ivory); text-align: center; font-size: 10px; text-transform: uppercase; letter-spacing: .08em; }
.vv-step b { display: block; font: 400 15px Fraunces, Georgia, serif; margin-bottom: 3px; }
fieldset { min-width: 0; margin: 0; padding: 0; border: 0; }
.vv-form-section { padding: 26px; border: 1px solid var(--vv-line); background: var(--vv-ivory); margin-bottom: 18px; }
.vv-form-section legend { width: 100%; padding: 0 0 18px; font: 300 1.4rem Fraunces, Georgia, serif; }
.vv-fields { display: grid; gap: 16px; }
.vv-field { display: grid; gap: 7px; }
.vv-field label, .vv-field-label { font-size: 12px; color: #45433f; }
.vv-field input, .vv-field select, .vv-field textarea {
  width: 100%; min-height: 48px; border: 1px solid #cfc9bf; background: white; border-radius: 0; padding: 11px 12px; color: var(--vv-ink);
}
.vv-field textarea { min-height: 92px; resize: vertical; }
.vv-choice { display: flex; gap: 12px; align-items: flex-start; padding: 14px; border: 1px solid var(--vv-line); cursor: pointer; }
.vv-choice + .vv-choice { margin-top: 10px; }
.vv-choice input { width: 20px; height: 20px; flex: 0 0 auto; }
.vv-choice strong { display: block; font-weight: 500; }
.vv-choice small { color: var(--vv-muted); }
.vv-check { display: grid; grid-template-columns: 22px 1fr; gap: 12px; margin-top: 14px; align-items: start; }
.vv-check input { width: 20px; height: 20px; margin-top: 2px; }
.vv-check a { text-decoration-thickness: 1px; text-underline-offset: 3px; }
.vv-obligation { margin-top: 22px; padding-top: 20px; border-top: 1px solid var(--vv-line); }
.vv-obligation p { margin: 0 0 14px; color: var(--vv-muted); font-size: 12px; }
.vv-error-summary { border: 1px solid #d9a7a2; background: #fbefed; color: #722c27; padding: 16px; margin-bottom: 20px; }
.vv-success-card { max-width: 820px; margin: 40px auto 0; border: 1px solid var(--vv-line); background: var(--vv-ivory); box-shadow: var(--vv-shadow); }
.vv-success-mark { width: 56px; height: 56px; display: grid; place-items: center; border: 1px solid var(--vv-bronze); border-radius: 50%; color: #806a48; font-size: 24px; }
.vv-success-card h1 { font: 300 clamp(2.3rem, 7vw, 4.3rem)/1 Fraunces, Georgia, serif; margin: 22px 0 12px; }
.vv-detail-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); border-top: 1px solid var(--vv-line); border-left: 1px solid var(--vv-line); margin: 24px 0; }
.vv-detail-grid > div { padding: 14px; border-right: 1px solid var(--vv-line); border-bottom: 1px solid var(--vv-line); }
.vv-detail-grid small { display: block; color: var(--vv-muted); text-transform: uppercase; letter-spacing: .08em; font-size: 9px; }
.vv-detail-grid strong { display: block; margin-top: 4px; font-weight: 500; word-break: break-word; }
.vv-cart-badge { min-width: 17px; height: 17px; border-radius: 99px; padding: 0 4px; display: inline-grid; place-items: center; background: var(--vv-bronze); color: var(--vv-navy); font-size: 9px; font-weight: 700; line-height: 1; }
.vv-cart-badge[hidden] { display: none; }
.vv-muted { color: var(--vv-muted); font-size: 12px; }
@media (min-width: 760px) {
  .vv-commerce-grid { grid-template-columns: minmax(0,1.65fr) minmax(280px,.75fr); }
  .vv-summary { position: sticky; top: 104px; }
  .vv-fields-2 { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .vv-cart-item { grid-template-columns: 132px 1fr; padding: 22px; }
}
@media (max-width: 759px) {
  .vv-commerce-main { width: min(100% - 24px, 620px); padding-top: 30px; }
  .vv-commerce-header { min-height: 66px; padding: 0 12px; }
  .vv-commerce-header img { width: 98px; }
  .vv-commerce-header .vv-back, .vv-commerce-header .vv-account { font-size: 0; }
  .vv-commerce-header .vv-back::after { content: '←'; font-size: 22px; }
  .vv-commerce-header .vv-account::after { content: 'Hesap'; font-size: 11px; }
  .vv-steps { grid-template-columns: repeat(2,1fr); }
  .vv-cart-item { grid-template-columns: 88px 1fr; gap: 13px; padding: 13px; }
  .vv-cart-line { align-items: flex-start; }
  .vv-form-section { padding: 20px 16px; }
  .vv-detail-grid { grid-template-columns: 1fr; }
  .vv-mobile-sticky { position: sticky; bottom: 0; z-index: 15; padding: 12px; margin: 20px -12px -12px; background: rgba(247,245,241,.96); border-top: 1px solid var(--vv-line); padding-bottom: max(12px, env(safe-area-inset-bottom)); }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; }
}
@media print {
  .vv-commerce-header, .vv-btn, .vv-mobile-sticky { display: none !important; }
  .vv-commerce-main { width: 100%; padding: 0; }
  .vv-panel, .vv-success-card { box-shadow: none; }
}

.vv-link-button {
  appearance: none;
  border: 0;
  padding: 0;
  color: inherit;
  background: transparent;
  font: inherit;
  text-decoration: underline;
  cursor: pointer;
}
.vv-legal-dialog {
  width: min(760px, calc(100vw - 24px));
  max-height: min(86vh, 900px);
  padding: 0;
  border: 1px solid var(--vv-line, #d7d1c7);
  border-radius: 18px;
  color: inherit;
  background: var(--vv-paper, #fff);
}
.vv-legal-dialog::backdrop { background: rgb(17 15 12 / 62%); }
.vv-legal-content {
  max-height: 55vh;
  overflow: auto;
  margin: 1rem 0;
  padding: 1rem;
  border: 1px solid var(--vv-line, #d7d1c7);
  white-space: pre-wrap;
  line-height: 1.65;
}
@media print {
  body:has(.vv-legal-dialog[open]) > *:not(.vv-legal-dialog) { display: none !important; }
  .vv-legal-dialog[open] { position: static; display: block; max-height: none; border: 0; }
  .vv-legal-dialog[open] .vv-legal-content { max-height: none; overflow: visible; border: 0; }
  .vv-legal-dialog[open] button { display: none; }
}