/* Alapok */
:root { --fg: #f7f0f0; }
* { box-sizing: border-box; }
html, body { height: 100%; }
body {
  margin: 0;
  font-family: "Open Sans", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color: var(--fg);
  background: linear-gradient(0deg,rgba(235, 52, 52, 1) 0%, rgba(227, 50, 50, 1) 100%); 
}

/* Rács: tartalom középen, social alul */
.page { min-height: 100dvh; display: grid; grid-template-rows: 1fr auto; }
.center { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 28px; padding: 24px; }

/* Linkek: egymás alatt, középen */
.link-list { display: flex; flex-direction: column; gap: 14px; align-items: center; width: 100%; }
.link-list a {
  display: block;
  width: clamp(260px, 60vw, 560px);
  background: rgba(255,255,255,0.20);
  border: 1px solid rgba(255,255,255,0.25);
  border-radius: 18px;
  padding: 14px 18px;
  color: var(--fg);
  text-decoration: none;
  font-weight: 600;
  transition: transform .12s ease, filter .12s ease, box-shadow .12s ease, border-color .12s ease;
}
.link-list a:hover {
  transform: translateY(-2px);
  filter: brightness(1.05);
  border-color: rgba(255,255,255,0.45);
  box-shadow: 0 8px 22px rgba(0,0,0,.25);
}
.link-list a span, .link-list a textarea { display: block; }
.link-list a textarea {
  width: 100%;
  min-height: 120px;
  background: transparent;
  color: var(--fg);
  border: 1px dashed rgba(255,255,255,.35);
  border-radius: 12px;
  padding: 10px;
  resize: vertical;
}

/* Social sáv alul */
.social {
  display: flex; justify-content: center; gap: 28px;
  padding: 28px 24px 32px;
  color: var(--fg);
}
.social a { color: inherit; font-size: 28px; opacity: .95; transition: transform .12s ease, opacity .12s ease; }
.social a:hover { transform: translateY(-2px); opacity: 1; }

/* Mobil */
@media (max-width: 520px) {
  .center { padding: 16px; gap: 18px; }
  .hero-card { border-radius: 22px; padding: 22px; }
  .social { gap: 22px; padding-bottom: 28px; }
}
/* Slotlakka anim */
.slot-title{
  font-family:"Open Sans",sans-serif;
  font-weight:700;
  font-size:clamp(32px,5vw,64px);
  color:#f7f0f0;
  letter-spacing:0.12em;
  text-align:center;
  margin:40px 0 16px;
  display:flex;
  justify-content:center;
  gap:.05em;
  align-items: baseline; /* vagy center, ha középre akarod */
}

.slot-title .word span {
  display: inline-block;
  height: 1em;
  line-height: 1em;
  vertical-align: baseline;
}

.slot-title .word span > span {
  display: inline-block;
  height: 1em;
  line-height: 1em;
}

.slot-char{
  position:relative;
  display:inline-block;
  width: .72em;           
  height: 1em;           
  overflow:hidden;
  line-height: 1em;
  will-change: transform;
  perspective: 800px;     
}
.slot-char > div{
  display:block;
  height:1em;
  line-height:1em;
  transform: translateY(0%);
  will-change: transform;
}

.slot-char::after{
  content:"";
  position:absolute; inset:0;
  background: linear-gradient(to bottom, rgba(0,0,0,.12), rgba(0,0,0,0) 30%, rgba(0,0,0,0) 70%, rgba(0,0,0,.12));
  pointer-events:none;
}