/* ----------------------------------------------
Template Name : zd (DESTRUCTION)
Template Code : z2026a
Version : 1.0
Author : sinner
Author URI : pages.dev
Last Date Modified : 2026-07-13 Mon, 2026-07-15 Wed,
2026-07-22 Wed.
------------------------------------------------- */


@import url("zf.css"); 


* {
  box-sizing: border-box;
  font-family: "Merriweather Sans", sans-serif;
  margin: auto;
  background: linear-gradient(rgb(150, 0, 0) 10%, rgb(0, 0, 0) 40%);
}

.container {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 99vw;
  margin: auto;
  height: 98vh;
  background: transparent;
  background: radial-gradient(circle, rgb(0, 0, 0) 0%, rgb(255, 0, 0) 35%, rgb(0, 0, 0) 0%);
  background: radial-gradient(circle, rgb(0, 0, 0) 10%, rgb(150, 0, 0) 35%, rgb(0, 0, 0) 90%);
  background: linear-gradient(rgb(0, 0, 0) 50%, rgb(255, 0, 0) 80%);
  animation: shake 1.25s;
  animation-iteration-count: infinite;
}

h1 {
  /* font: 600 3.5em/1.25em "Oswald", sans-serif; */
  font-family: "Oswald", sans-serif;
  font-size: clamp(1.5rem, 15.5vw, 16rem);
  font-weight: 500;
  max-width: 98vw;
  text-align: center;
  color: white;
  letter-spacing: -0.02em;
  background: transparent;
}

.quo, .rep {
  color: white;
  font-size: 1.2em;
  font-weight: 400;
  background: transparent;
  margin: 1em 1.5em 1.5em;
}

.rep {
  font-weight: 600;
  margin: 0em 1.5em 2em;
}

@keyframes shake {
  0% { transform: translate(1px, 1px) rotate(0deg); }
  10% { transform: translate(-1px, -2px) rotate(-1deg); }
  20% { transform: translate(-3px, 0px) rotate(1deg); }
  30% { transform: translate(3px, 2px) rotate(0deg); }
  40% { transform: translate(1px, -1px) rotate(1deg); }
  50% { transform: translate(-1px, 2px) rotate(-1deg); }
  60% { transform: translate(-3px, 1px) rotate(0deg); }
  70% { transform: translate(3px, 1px) rotate(-1deg); }
  80% { transform: translate(-1px, -1px) rotate(1deg); }
  90% { transform: translate(1px, 2px) rotate(0deg); }
  100% { transform: translate(1px, -2px) rotate(-1deg); }
}
