/* =========================================================
   HUBAFRIKA — TERMS OF USE PAGE
   Uses only the theme's own color variables. The mockup for
   this page already matched the site's palette (black text,
   red accents, --link blue), so this mainly adds the legal-
   copy typography (numbered sections, bullet lists) that the
   rest of the theme didn't need yet.
   ========================================================= */

.terms-page{
  padding-bottom:10px;
}

.terms-heading{
  font-family:var(--font-head);
  font-size:34px;
  font-weight:bold;
  color:var(--dark);
  margin-bottom:18px;
}

.terms-intro p{
  font-size:15px;
  line-height:1.7;
  color:var(--gray-text);
  margin-bottom:8px;
  max-width:720px;
}

.terms-section{
  margin-top:30px;
}

.terms-section h2{
  font-family:var(--font-body);
  font-size:18px;
  font-weight:bold;
  color:var(--dark);
  margin-bottom:12px;
}

.terms-section p{
  font-size:14.5px;
  line-height:1.7;
  color:var(--gray-text);
  margin-bottom:10px;
  max-width:720px;
}

.terms-section ul{
  list-style:none;
  margin:6px 0 4px;
  max-width:720px;
}

.terms-section ul li{
  position:relative;
  font-size:14.5px;
  line-height:1.6;
  color:var(--gray-text);
  padding-left:18px;
  margin-bottom:10px;
}

.terms-section ul li::before{
  content:"";
  position:absolute;
  left:2px;
  top:9px;
  width:5px;
  height:5px;
  border-radius:50%;
  background:var(--red);
}

.terms-section ul li strong{
  color:var(--dark);
}

.terms-contact p{
  font-size:14.5px;
  color:var(--dark);
  margin-bottom:8px;
}

.terms-contact a{
  color:var(--link);
  text-decoration:underline;
}

.terms-contact a:hover{
  color:var(--red);
}