:root{
  --viva-red:#ff2400;
  --viva-red-soft:#ff4229;
  --viva-white:#ffffff;
  --viva-black:#060606;
  --viva-grey:#4e4e4e;
  --field-border:#bbbbbb;
  --field-bg:#ffffff;
  --copy:#ffffff;
  --muted:rgba(255,255,255,.82);
}

*{box-sizing:border-box}
html{min-height:100%;background:#000}
body{
  min-height:100%;
  margin:0;
  color:var(--copy);
  font:500 14px/1.55 "Libre Franklin", Helvetica, Arial, Lucida, sans-serif;
  background:
    linear-gradient(rgba(0,0,0,.18),rgba(0,0,0,.38)),
    url('/static/viva-bg-2.jpg') center top / cover fixed,
    #111;
}
body:before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  background:rgba(0,0,0,.22);
  z-index:-1;
}

.wrap{
  width:min(1012px, calc(100% - 40px));
  margin:0 auto;
  padding:72px 0 96px;
}

.site-hero{
  display:grid;
  grid-template-columns:minmax(260px, 465px) 1fr;
  gap:80px;
  align-items:end;
  min-height:430px;
  padding:96px 0 52px;
  background:transparent;
}
.hero-logo img{
  display:block;
  width:100%;
  max-width:465px;
  height:auto;
}
.hero-copy{max-width:465px}
.kicker,
.pill{
  color:var(--viva-red-soft);
  font-family:"Fjalla One", Helvetica, Arial, Lucida, sans-serif;
  font-size:16px;
  letter-spacing:.03em;
  text-transform:uppercase;
  margin:0 0 10px;
}
h1,h2,h3{
  margin:0;
  padding:0 0 10px;
  color:var(--viva-red-soft);
  font-family:"Fjalla One", Helvetica, Arial, Lucida, sans-serif;
  font-weight:700;
  line-height:1.2;
  letter-spacing:0;
}
h1{font-size:clamp(30px, 4vw, 48px)}
h2{font-size:26px;margin-top:34px}
h3{font-size:22px}
p{margin:0;padding:0 0 14px;color:var(--copy)}
strong{font-weight:800}
a{color:var(--viva-white)}

.top{
  display:flex;
  justify-content:space-between;
  gap:24px;
  align-items:center;
  margin:0 0 20px;
}
.top .pill{
  border:0;
  padding:0;
  color:var(--viva-red-soft);
  font-size:18px;
}

.card{
  background:transparent;
  border:0;
  border-radius:0;
  padding:0;
  box-shadow:none;
  margin:0 0 38px;
  max-width:100%;
}
form.card{
  display:block;
  max-width:720px;
}
form.card h2{
  border-top:1px solid rgba(255,255,255,.35);
  padding-top:28px;
  margin-top:42px;
}

label{
  display:block;
  font-weight:700;
  color:var(--viva-white);
  margin:15px 0 6px;
}
.required:after{content:" *";color:var(--viva-red-soft)}
.muted{color:var(--muted)}
.small{font-size:.92rem}

input,
textarea,
select{
  width:100%;
  max-width:100%;
  min-height:38px;
  padding:8px 10px;
  border:1px solid var(--field-border);
  border-radius:0;
  background:var(--field-bg);
  color:var(--viva-grey);
  font:500 14px/1.4 "Libre Franklin", Helvetica, Arial, Lucida, sans-serif;
  box-shadow:none;
}
textarea{min-height:146px;resize:vertical}
input:focus,textarea:focus,select:focus{
  outline:2px solid var(--viva-red);
  outline-offset:1px;
}
input[type="file"]{
  padding:10px;
  background:rgba(255,255,255,.94);
}

.grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:0 24px;
}
.checks{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px 24px;
  margin:8px 0 12px;
}
.checks label{
  display:flex;
  gap:8px;
  align-items:flex-start;
  font-weight:600;
  margin:0;
  color:var(--viva-white);
}
.checks input{
  width:auto;
  min-height:0;
  margin-top:4px;
  accent-color:var(--viva-red);
}

button,
.button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:43px;
  padding:12px 14px;
  border:0;
  border-radius:0;
  background:var(--viva-red);
  color:var(--viva-white);
  font:800 16px/1 "Libre Franklin", Helvetica, Arial, Lucida, sans-serif;
  text-decoration:none;
  cursor:pointer;
  box-shadow:none;
}
button:hover,.button:hover{background:var(--viva-red-soft)}
.button.secondary{
  background:rgba(0,0,0,.35);
  border:1px solid rgba(255,255,255,.5);
  color:var(--viva-white);
}

.flash{
  padding:12px 14px;
  border:1px solid var(--viva-red);
  background:rgba(255,36,0,.18);
  color:var(--viva-white);
  margin:0 0 20px;
}
.honeypot{position:absolute;left:-9999px}

.report-list{display:grid;gap:12px;max-width:720px}
.report-row{
  display:block;
  border:1px solid rgba(255,255,255,.35);
  padding:14px;
  background:rgba(0,0,0,.32);
  text-decoration:none;
}
.report-row:hover{border-color:var(--viva-red-soft)}
.kv{
  display:grid;
  grid-template-columns:220px 1fr;
  gap:12px;
  border-bottom:1px solid rgba(255,255,255,.26);
  padding:9px 0;
}
.kv strong{color:var(--viva-red-soft)}

section.card:first-of-type{
  max-width:720px;
}
section.card:first-of-type h1{
  display:none;
}

@media(max-width:820px){
  body{background-attachment:scroll}
  .wrap{width:min(92%, 720px);padding:32px 0 64px}
  .site-hero{grid-template-columns:1fr;gap:28px;min-height:0;padding:36px 0 28px;align-items:start}
  .hero-logo img{max-width:340px}
  .grid,.checks{grid-template-columns:1fr}
  .kv{grid-template-columns:1fr}
  .top{align-items:flex-start;flex-direction:column}
}