/*
 * Bağlantı sayfası (link.beymucevherat.com). Sitenin dili: krem zemin, espresso yazı ve ince çizgi,
 * köşesiz düğmeler, büyük harf ve 0,15em harf aralığı (apps/site/src/styles/tokens.css). Fontlar
 * sitenin boru hattı alt kümeleri (SIL OFL 1.1; lisanslar /fonts/OFL-*.txt). Pembe yok.
 */
@font-face {
  font-family: Jost;
  font-weight: 400 500;
  font-display: swap;
  src: url('/fonts/jost-latin.618f49de0b.woff2') format('woff2');
}

@font-face {
  font-family: 'Cormorant Garamond';
  font-weight: 500;
  font-display: swap;
  src: url('/fonts/cormorant-garamond-latin-500.c424d8c30d.woff2') format('woff2');
}

:root {
  --espresso: #4c1e0c;
  --krem: #f5f0e4;
  --krem-acik: #fcf5e6;
  --cizgi: #d7c4ae;
  --soluk: #805c49;

  color-scheme: light;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body {
  display: grid;
  min-block-size: 100vh;
  min-block-size: 100svh;
  margin: 0;
  place-items: center;
  padding: 3rem 1.5rem;
  background: var(--krem);
  color: var(--espresso);
  font-family: Jost, Arial, sans-serif;
  font-size: 1rem;
  line-height: 1.5;
}

.kart {
  display: flex;
  flex-direction: column;
  align-items: center;
  inline-size: 100%;
  max-inline-size: 22rem;
  text-align: center;
}

.marka {
  margin: 0;
  line-height: 0;
}

.marka img {
  display: block;
  inline-size: 13.5rem;
  max-inline-size: 70vw;
  block-size: auto;
}

.ust-yazi {
  margin: 1.5rem 0 0;
  color: var(--soluk);
  font-family: 'Cormorant Garamond', 'Times New Roman', serif;
  font-size: 1.25rem;
  font-weight: 500;
  letter-spacing: 0.02em;
}

.cizgi {
  inline-size: 2.5rem;
  margin: 1.5rem auto 2.25rem;
  border: 0;
  border-block-start: 1px solid var(--espresso);
}

.baglantilar {
  display: grid;
  gap: 0.875rem;
  inline-size: 100%;
}

.dugme {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
  min-block-size: 3.25rem;
  padding: 0.75rem 1.25rem;
  border: 1px solid var(--espresso);
  background: var(--krem-acik);
  color: var(--espresso);
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: 0.15em;
  text-decoration: none;
  text-transform: uppercase;
  transition:
    background-color 160ms ease,
    color 160ms ease;
}

.dugme[hidden] {
  display: none;
}

.dugme svg {
  flex: none;
  fill: none;
  stroke: currentcolor;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.dugme svg.dolu,
.dugme .nokta {
  fill: currentcolor;
  stroke: none;
}

.dugme:hover {
  background: var(--espresso);
  color: var(--krem);
}

.dugme:focus-visible {
  outline: 2px solid var(--espresso);
  outline-offset: 3px;
}

.alt-yazi {
  margin: 2.5rem 0 0;
  color: var(--soluk);
  font-size: 0.75rem;
  letter-spacing: 0.08em;
}

@media (prefers-reduced-motion: reduce) {
  .dugme {
    transition: none;
  }
}
