:root {
  --gris: #4d4d4d;
  --gris-claro: #ececec;
  --naranja: #f75419;
  --blanco: #ffffff;
}

* { box-sizing: border-box; margin: 0; padding: 0; }

html, body { height: 100%; }

body {
  font-family: "Montserrat", system-ui, sans-serif;
  background: var(--gris-claro);
  color: var(--gris);
  display: flex;
  justify-content: center;
}

/* Banderín blanco, igual que en la pieza del logo */
.banderin {
  background: var(--blanco);
  width: min(560px, calc(100% - 32px));
  min-height: 82vh;
  clip-path: polygon(0 0, 100% 0, 100% 80%, 50% 100%, 0 86%);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2rem;
  padding: 3rem 2rem 9rem;
  text-align: center;
}

.logo { width: min(320px, 80%); height: auto; }

.estado {
  font-size: .8rem;
  font-weight: 600;
  letter-spacing: .3em;
  text-transform: uppercase;
}

.estado::before {
  content: "";
  display: block;
  width: 40px;
  height: 4px;
  background: var(--naranja);
  margin: 0 auto 1rem;
  transform: skewX(-35deg);
}
