.vwpp,
.vwpp *{box-sizing:border-box}

.vwpp{
  --vwpp-cream:#F7F0E5;
  --vwpp-white:#FFFDFC;
  --vwpp-brown:#3B2416;
  --vwpp-muted:#716158;
  --vwpp-petrol:#2F6964;
  --vwpp-petrol-dark:#173F3A;
  --vwpp-gold:#F4B400;
  --vwpp-line:rgba(47,105,100,.14);
  position:relative;
  width:100%;
  color:var(--vwpp-brown);
  font-family:"Manrope","Inter",Arial,sans-serif;
}

.vwpp[hidden]{display:none!important}
.vwpp button,.vwpp input,.vwpp select{font:inherit}
.vwpp button:focus-visible,.vwpp input:focus-visible,.vwpp select:focus-visible{
  outline:3px solid rgba(244,180,0,.5);
  outline-offset:3px
}

.vwpp__shell{
  padding:clamp(22px,3.2vw,34px);
  border:1px solid var(--vwpp-line);
  border-radius:26px;
  background:linear-gradient(145deg,rgba(255,255,255,.72),rgba(247,240,229,.86));
  box-shadow:0 18px 52px rgba(23,63,58,.07)
}

.vwpp--compact .vwpp__shell{
  padding:22px;
  border-radius:22px
}

.vwpp__eyebrow{
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:var(--vwpp-petrol);
  font-size:9px;
  font-weight:900;
  letter-spacing:.09em;
  text-transform:uppercase
}

.vwpp__eyebrow::before{
  content:"";
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--vwpp-gold)
}

.vwpp__head{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:20px;
  align-items:start
}

.vwpp__title{
  margin:10px 0 0;
  max-width:820px;
  color:var(--vwpp-brown);
  font-family:"Lora",Georgia,serif;
  font-size:clamp(28px,3.5vw,43px);
  font-weight:500;
  line-height:1.08;
  letter-spacing:-.035em
}

.vwpp__copy{
  max-width:760px;
  margin:12px 0 0;
  color:var(--vwpp-muted);
  font-size:14px;
  line-height:1.65
}

.vwpp__existing{
  align-self:center;
  max-width:260px;
  padding:10px 12px;
  border-radius:14px;
  background:rgba(47,105,100,.07);
  color:var(--vwpp-petrol-dark);
  font-size:10px;
  font-weight:800;
  line-height:1.45
}

.vwpp__form{
  display:grid;
  grid-template-columns:1fr 1.35fr .72fr 1fr;
  gap:10px;
  margin-top:24px
}

.vwpp__field{display:block}
.vwpp__label{
  display:block;
  margin:0 0 7px;
  color:var(--vwpp-petrol-dark);
  font-size:11px;
  font-weight:850
}

.vwpp__species{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:7px
}

.vwpp__species-btn{
  min-height:48px;
  padding:0 12px;
  border:1px solid rgba(47,105,100,.16);
  border-radius:13px;
  background:rgba(255,255,255,.72);
  color:var(--vwpp-brown);
  cursor:pointer;
  font-size:12px;
  font-weight:800
}

.vwpp__species-btn.is-active{
  border-color:rgba(47,105,100,.52);
  background:rgba(47,105,100,.09);
  color:var(--vwpp-petrol-dark)
}

.vwpp__input,.vwpp__select{
  width:100%;
  min-height:48px;
  padding:0 13px;
  border:1px solid rgba(47,105,100,.16);
  border-radius:13px;
  background:rgba(255,255,255,.82);
  color:var(--vwpp-brown);
  outline:none
}

.vwpp__age-wrap{
  display:grid;
  grid-template-columns:minmax(0,1fr) 92px;
  gap:7px
}

.vwpp__actions{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:10px;
  margin-top:18px
}

.vwpp__save,.vwpp__tiercheck,.vwpp__clear{
  min-height:48px;
  padding:0 18px;
  border-radius:999px;
  font-size:12px;
  font-weight:900;
  cursor:pointer
}

.vwpp__save{
  border:0;
  background:var(--vwpp-petrol);
  color:#fff
}

.vwpp__tiercheck{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:0;
  background:var(--vwpp-gold);
  color:var(--vwpp-brown)!important;
  text-decoration:none!important
}

.vwpp__clear{
  border:1px solid rgba(59,36,22,.13);
  background:transparent;
  color:rgba(59,36,22,.62)
}

.vwpp__status{
  flex:1 1 240px;
  margin:0;
  color:var(--vwpp-petrol-dark);
  font-size:10px;
  font-weight:800;
  line-height:1.5
}

.vwpp__privacy{
  margin:12px 0 0;
  color:rgba(59,36,22,.48);
  font-size:9px;
  line-height:1.5
}

.vwpp--about .vwpp__shell{
  background:linear-gradient(145deg,rgba(244,180,0,.055),rgba(255,255,255,.64))
}

.vwpp--home .vwpp__title{font-size:clamp(24px,3vw,34px)}
.vwpp--home .vwpp__copy{font-size:13px}

@media(max-width:920px){
  .vwpp__form{grid-template-columns:1fr 1fr}
  .vwpp__head{grid-template-columns:1fr}
  .vwpp__existing{max-width:none}
}

@media(max-width:620px){
  .vwpp__shell{padding:19px 15px;border-radius:20px}
  .vwpp__form{grid-template-columns:1fr}
  .vwpp__age-wrap{grid-template-columns:minmax(0,1fr) 100px}
  .vwpp__actions{display:grid;grid-template-columns:1fr}
  .vwpp__save,.vwpp__tiercheck,.vwpp__clear{width:100%}
  .vwpp__status{grid-column:1/-1}
}